javascript - 替换内容后如何触发 jQuery .click()？

Question

我的 HTML 看起来像这样

<div id="current">&nbsp;</div>

<div class="data1">
  <div class="foo"><p>Some Text</p></div>
</div>

<span onclick="replace()">Click to replace div</span>

我的 JQuery/javascript 是这样的

$(document).ready(function() {
  $('.foo').click(function() {
    alert('worked');
  })
})

function replace() {
   $('#current').html($('.data1').html());
}

警报在 .data1 div 中的 .foo 类上正常触发，但在将 #current 的内容替换为 .data1 后，onclick 事件不会在第一个 div 中的 .foo 类上触发。

我错过了什么？任何帮助将不胜感激!

Answer 1

使用 .html() 将创建新的 HTML 元素，但事件不会发生。您需要附加一个 DOM 元素。 DOM 元素应该是原始元素的克隆:

$('#current').empty().append($('.data1').clone(true));

• > .clone
• > .empty
• > .append