1

这是我想要实现的简化示例：http: //jsfiddle.net/easLc/

HTML 

<div class="bar">
  <div class="apple"> apple</div>
  <div class="banana"> banana</div>
  <div class="citrus"> citrus </div>
</div>

jQuery 

function showAlert(event) {
    inventory = event.data.inventory;
    alert(inventory);        
}

fruits = ["apple", "banana", "citrus"];
inventory = [13, 45, 99];

for (i in fruits) {        
    $(".bar ."+fruits[i]).on("click", {inventory:inventory[i]},showAlert);
}

我传递给处理程序的库存数据是动态的，而不是像示例那样是静态的。我从异步调用中获取库存数据。每次更新库存数据后，我想将此数据传递给处理程序，而不是让处理程序再次获取该信息。

我注意到一些点击，处理程序（我认为）正在使我的浏览器崩溃。我是否无意中创建了太多处理程序？如何查看创建了哪些处理程序？或者在点击事件期间会发生什么？我尝试将一些 console.log 添加到处理程序，但在控制台中看不到它们。

谢谢！

4

2 回答 2

1

您可以通过在绑定元素后向元素添加某种数据来防止多次绑定（一种干净的方式是一个类，但标准可能首选元数据）：

$(".bar ." + fruits[i]).not(".bound").on('click', {...}).addClass('bound');
于 2012-10-09T14:47:23.910 回答
1

尝试

$(".bar ."+fruits[i]).off('click',showAlert).on("click", {inventory:inventory[i]},showAlert);

这将删除之前绑定的事件并重新绑定它......但很难确定它是否是问题的真正根源。您可以在 showAlert 中添加一个 console.log('text') 以查看它是否被多次调用。

于 2012-10-09T15:09:24.297 回答