jQuery clone()不克隆事件绑定,即使使用on()
我创build了一系列用于移动Web应用程序的自定义jQuery事件。 他们工作很好,并经过testing。 但是,我遇到了一个我无法理解的小问题。
我正在使用.clone()
DOM中的一些元素,其中包含一个button。 该button有一些自定义事件绑定到它(事件绑定使用.on()
),但。 不幸的是,当我使用jQuery的.clone()
,绑定不会被保留,我不得不再次添加它们。
有没有人遇到过这个,有人知道一个潜在的工作? 我认为使用.on()
应该保留现在或将来存在的元素的绑定。
我想你应该使用.clone()方法的重载:
$element.clone(true, true);
克隆([withDataAndEvents] [,deepWithDataAndEvents])
withDataAndEvents :布尔值,指示事件处理程序和数据是否应与元素一起复制。 默认值是false。
deepWithDataAndEvents :布尔值,指示是否应复制克隆元素的所有子项的事件处理程序和数据。 默认情况下,它的值匹配第一个参数的值(默认为false)。
请注意, .on()
实际上不会将事件绑定到目标,而是绑定到要委派的元素。 所以如果你有:
$('#container').on('click', '.button', ...);
事件实际上绑定到#container
。 当一个.button
元素发生点击时,它会起泡到#container
元素。触发事件的元素将根据.on()
的selector参数进行.on()
,如果匹配,则执行事件处理程序。 这是事件代表团的工作原理。
如果您复制元素#container,则必须深入克隆使用.on()
进行的绑定的事件和数据才能被保留。
如果您在#container
的父级上使用.on()
,则这不是必需的。