运行 jQuery 仅在页面加载后点击

Question

我有一个页面正在从 firebase 中提取内容并将其附加到该页面：

代码：

function displaySavedData(Name, Company, Email, Phone, snap) {
    $('.data').append('<div class="each-container" data-del="'+snap+'"><div class="del">X</div><div class="row-margin"><div class="new-row-one">'+'Name: '+Name+'<br>'+'Company: '+Company+'<br>'+'Email: '+Email+'<br>'+'Phone: '+Phone+'</div></div></div>');
};

那里有一个div，每添加一个div到页面，就会得到一个class of del，并带有一个X来显示。我试图在单击 X 时使单击事件起作用，但由于 class 在加载时页面上不存在，因此单击事件未注册。我怎样才能在页面加载后让它工作？

点击事件：

$('.del').click(function(){
    console.log('clicked');
});

JSFiddle：http://jsfiddle.net/0a5s7uLk/1/

Answer 1

将您的事件切换为 'on' 事件而不是点击，

$(document).on("click", ".del", function() {
  console.log('clicked');
});

这将挂钩稍后插入到 dom 的元素的事件。

运行 jQuery 仅在页面加载后点击

run jQuery click only after page loads

jquery

click

firebase