0

有人可以建议解决这个问题的好方法：

在页面加载时，将事件处理程序添加到页面元素。例如：

// Javascript
// when page is loaded...
jQuery(document).ready(function) {
  // assign this handler to the buttonDiv element...
  jQuery("#buttonDiv").click(function() {
    // to alert "hello"
    alert("hello");
  });
}


// HTML 5
<div id="buttonDiv">Click me </div>

这按预期工作 - 太棒了！

但是假设在div#buttonDiv加载文档并稍后使用 Ajax 添加到 DOM 时不存在。在这种情况下，click()不会添加事件处理程序，也不会调用警报。

如果不使用内联 javascript，如何向该元素添加事件处理程序？

欢迎任何建议。

4

1 回答 1

1

这就是.live():) 像这样：

jQuery(function) {
  jQuery("#buttonDiv").live("click", function() {
    alert("hello");
  });
});

.live()真正添加元素时不会添加事件处理程序，但会document在您运行它时添加事件处理程序，并侦听click冒泡的事件。由于新旧元素以相同的方式冒泡......添加它们的时间并不重要click，只要选择器匹配，处理程序仍然可以工作。

如果您知道按钮将位于某个容器内，也可以使用类似的.delegate()（甚至.live()在内部使用），假设您正在#content通过 AJAX 重新加载容器，它看起来像这样：

jQuery(function) {
  jQuery("#content").delegate("#buttonDiv", "click", function() {
    alert("hello");
  });
});

这增加了冒泡事件的侦听器，#content在捕获它之前只保存一些气泡，而不是让它一直到document......在实践中两者都很好，你无法分辨性能差异，除非你是做大量的.live()事件处理程序。

于 2010-09-09T10:25:53.877 回答