动态制作 onClick 事件？答案

【问题标题】：dynamically making onClick event?动态制作 onClick 事件？
【发布时间】：2011-10-22 05:32:21
【问题描述】：

我知道Javascript - Dynamically assign onclick event in the loop 这里有人问过类似的问题，但我觉得我有点困惑，无法添加评论。

我在数组“newdiv”中动态地制作了一系列 div。我想创建一个 onClick 函数，它将 offsetHeight 扩展到 scrollHeight。

我正试图在我的 for 循环中这样做：

newdiv[i].onclick = function() {expandThis(message_id) };

在哪里

message_id = message_array[i][0];

（数组中的 id 列，在消息 'i' 处）

这个问题很熟悉——所有的onClicks 都引用了最后一个message_id。有没有一种简单的方法可以让 newdiv[i] 的 onClick 引用 message_array[i][0]？

【问题讨论】：

似乎每个 div 都需要知道自己的身份。将任意属性添加到 DOM 后，是否可以将任意属性附加到 div，例如 newdiv[i].myid = i;然后在你的函数中引用这个属性：expandThis(this.myid);?
@Matt M：闭包方法要好得多；你只需要小心地把它关在正确的地方。

【解决方案1】：

您可以使用匿名函数创建一个闭包来包含要引用的值。

function(message_id) {
  newdiv[i].onclick = function() {expandThis(message_id) };
}(message_array[i][0]);

JavaScript 是一种没有 let 语句的函数式编程语言。所以你必须写一个等价的闭包，看起来很丑。

【讨论】：

var 语句不是 let 吗？
在典型的函数式语言（如 Lisp、Ocaml 或 Haskell）中，let 语句不仅为名称赋值，还创建一个闭包。在 JS 中，var 会分配一个名称，但不会创建一个闭包。

【解决方案2】：

你需要用 message_id 打破闭包：

newdiv[i].onclick = (function(id) {
                       return function() {expandThis(id) };
                    }(message_id));

像这样的问题有一百万个，例如Do while javascript Problem.

【讨论】：

【解决方案3】：

您可以动态创建 javascript 代码并将其存储在 var 中，然后使用 evalute() 函数并将结果分配给您的 onclick 回调。

【讨论】：