.live()vs .on()方法
我正在开发一个项目,当我按下min / plus按钮而没有使用.live()
方法hover图片时,该function正常工作。 在.on()
方法的情况下,该函数不起作用。
我该如何解决这个问题,所以它也适用于.on()
方法?
这是我所指的一个例子 (我修复了这个例子中的错误,但我使用的是.on
方法错误)。
你没有正确使用它。 .live()
的替换是$(document).on()
,事件和处理程序被传入,当然……例如:
$(document).on('click', '#myElement', function() { //... some function ... });
值得一提的是,在.on()
出现之前, .live()
已经被认为是处理这种绑定的低效方法。 建议使用.on()
,现在是.on()
(使用委托者语法)。
或者作为一个例子:你应该选择最近的祖先,而不是将文件作为监听器(这是用来做的.live()
),而不应该使用DOM操作来破坏它。 老实说,我发现“jsdo.it”使用起来有点笨拙,所以我没有考虑具体的因素,但是,例如,给定结构:
Some dynamically-loaded content
如果ajax_container
的内容被Ajax调用替换(不需要显示该部分的代码),则为该按钮的click事件绑定未破坏的侦听器(容器div)将如下所示:
$('#ajax_container').on('click', '#do_something', function() { // do something })
您必须发布一些代码以确定您的实现无法正常工作,但您应该查看jQuery源代码以获取如何使用.on()和.live()的示例
$('#anchor').live('click',function() { }): $('#parent').on('click','#anchor',function() { }); $('#anchor').on('click',function() { });
将.live()事件侦听器添加到document元素中,以便只要事件一直冒泡到文档元素,就会触发回调
在第二个例子中($(’#parent’)。on()),事件监听器被添加到父元素中,并且每次点击事件冒泡到#parent并且来自(或沿途交互)时都会触发)一个名为#anchor的元素
第三个例子($(’#anchor’)。on())将事件监听器直接添加到锚元素本身,与$(’#anchor’)完全相同.bind(’click’,function(){ });
引入.live()的原因是,如果您的页面结构发生更改,仍然可以触发事件回调,因为事件侦听器本身已附加到document元素。
您可以在类似的方法中使用on,但必须将其自身附加到未从页面中删除的元素 – 如果该元素被删除,那么所有事件侦听器也随之被删除。