javascript - javascript 事件未注册

Question

我有一个奇怪的行为。在网页中，我导入了一些脚本并定义了一些 js 函数。

<script type="text/javascript">
$(function() {
}
</script>

当我单击一个按钮时，我会显示一个对话框（此块）我从服务器获取一些信息......并将其插入 bookInfoBlock 区域

最后我得到了

<div id="bookDialog" title="book info" style="display:none">
  <button type="button" id="addBook1">+</button>
  <div id="bookInfoBlock">
        <button type="button" id="addBook2">+</button>
  </div>
</div>



$('[id^=addBook]').click(function() {
  alert("book test");
});

当我单击带有 addBook1 的按钮时，我看到了警报……但当我单击 addBook2 时却没有。就像最后一个不知道事件和javscript

Answer 1

看起来您正在addBook2通过 ajax 动态加载。在这种情况下，使用.on()使用事件委托。如果 divbookInfoBlock是静态的并且一直存在于 DOM 中，请使用它。

$('#bookInfoBlock').on('click', '[id^=addBook]'), function() {
  alert("book test");
});

或者如果您不确定静态父级，请使用此

$(document.body).on('click', '[id^=addBook]'), function() {
  alert("book test");
});

从 jQuery 1.7 开始， .live() 方法在 1.9 版本中被完全弃用和删除。对于旧版本，使用.live()而不是on()

$('[id^=addBook]').live('click', function() {
  alert("book test");
});

Answer 2

您可以使用delegate而不是click.

live没有更多使用，有delegate：

$(document).delegate('[id^=addBook]','click', function() {
  alert("book test");
});