javascript - 调整大小功能来替换 div 禁用 onclick 功能

Question

我知道这个标题很糟糕，但我不知道什么会更好。

情况是，根据 $(window).width()，我在绝对坐标上创建了几个带有 div 的跨度。当我调整它的大小时，我想重新排列它们，因此在 $(window).resize() 上我调用函数来删除跨度， $("span").empty(); 并做与我当时创建时完全相同的事情。此外，还有一个单击功能，可以很好地处理第一个创建的跨度，然后当我清除然后并在调整大小后创建完全相同的东西时，它不起作用。

请看简化版的jsfiddle来理解。首先尝试单击对象。然后调整窗口大小并尝试单击它。

http://jsfiddle.net/4159v04o/1/

有什么想法为什么会发生这种情况吗？预先感谢您!

Answer 1

这是由于 div 是动态创建/删除的。您需要的是event delegation .

Event delegation allows us to attach a single event listener, to a parent element, that will fire for all descendants matching a selector, whether those descendants exist now or are added in the future.

替换:

$('div').on({click: function() {

与:

$(document).on("click", "div", function() {

Updated fiddle