ASP.NET动态生成JavaScript函数名后如何从HTML div调用？

你的问题出在HTML内联事件的字符串拼接语法错误上，导致浏览器无法识别正确的函数名，所以调用无响应。咱们一步步来解决：

1. 快速修复：修正内联onmouseover写法 #

你原来的函数定义是没问题的：

<script> function mouseOver<%= _@special.ObjectId %>() { //do stuff; } </script>

模板引擎会把<%= _@special.ObjectId %>替换成对应的数字（比如123），生成类似mouseOver123()的函数。

但调用时你错误混用了字符串拼接和模板变量插入，导致最终生成的HTML里onmouseover的值是无效代码。正确写法应该直接在模板里把变量插入到函数名中：

<div onmouseover='mouseOver<%= _@special.ObjectId %>()'></div>

模板引擎处理后会生成类似这样的HTML：

<div onmouseover='mouseOver123()'></div>

浏览器就能正确识别并调用对应的函数了。

2. 更推荐的方案：使用事件监听（替代内联事件） #

内联事件虽然简单，但不利于代码维护，还容易出现这类语法问题。更优雅的做法是给元素加标识，再用JS动态绑定事件：

步骤1：给元素添加data属性 #

<div data-object-id="<%= _@special.ObjectId %>"></div>

步骤2：用JS监听mouseover事件并调用对应函数 #

// 遍历所有带data-object-id的元素
document.querySelectorAll('[data-object-id]').forEach(element => {
  element.addEventListener('mouseover', function() {
    // 获取元素上的objectId
    const objectId = this.dataset.objectId;
    // 通过window对象调用对应的动态函数
    window[`mouseOver${objectId}`]();
  });
});

这种方式不用拼接内联字符串，代码更清晰，也符合现代前端开发规范。

为什么原来的写法无效？ #

你原来的调用代码onmouseover='mouseOver" + _@special.ObjectId +"()'，模板引擎处理后会生成类似onmouseover='mouseOver" + 123 +"()'的属性值——这不是有效的JS代码，浏览器会把它当成字符串拼接片段，而非函数调用，自然不会执行任何操作。

内容的提问来源于stack exchange，提问作者positive perspective