jQuerybind、delegate、live和on比较-创新互联

JQuery的delegate()方法是给页面里的元素(或者页面里未来将会有的元素)绑定事件，同样的从结果来看JQuery的bind()方法同样也是给元素绑定事件，但是它(bind)只能给页面中当前已经存在的元素去绑定事件。

创新互联建站是一家集网站建设,新吴企业网站建设,新吴品牌网站建设,网站定制,新吴网站建设报价,网络营销,网络优化,新吴网站推广为一体的创新建站企业，帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿，时刻以成就客户成长自我，坚持不断学习、思考、沉淀、净化自己，让我们为更多的企业打造出实用型网站。

JQuery的live()方法同样也是给元素绑定事件，但是它(live)在页面有改动的时候，JQuery把相应函数绑定到$(document)元素上。任何时候只要有事件冒泡到document节点上，它就查看该事件是否是一个绑定事件，以及该事件的目标元素与这一选择器是否匹配，如果都是的话，则执行函数。JQuery 1.7以后就不支持live()了。

JQuery的on()方法同样也是给元素绑定事件，它(on)是整合了之前的三种方式的新事件绑定机制。

例子：

<html>

<head>

$(document).ready(function(){

$("div").delegate("p","click",function(){

$(this).slideToggle();

});

$("button").click(function(){

$("<p>这是一个新段落。</p>").insertAfter("button");

});

</script>

</head>

<body>

<div >

<p>这是一个段落。</p>

<p>请点击任意一个 p 元素，它会消失。包括本段落。</p>

<button>在本按钮后面插入一个新的 p 元素</button>

</div>

<p><b>注释：</b>通过使用 delegate() 方法，而不是 live()，只有 div 元素中的 p 元素会受到影响。</p>

</body>

</html>

标红的P是通过点击button才能被加载到页面的，也就是说，在document.ready的时候页面里还没有这个P元素，所以说需要用delegate()方法给P绑定事件，此时用click()或者bind()是做不到给可能被加载到这个页面的P元素绑定事件的。

但是这个button是页面中已经存在的，用click就可以给绑定上事件。当然了，用delegate()也行。

为什么选择.live()或.delegate()而不是.bind()

毕竟，bind看起来似乎更加的明确和直接，难道不是吗?嗯，有两个原因让我们更愿意选择delegate或live而不是bind：

1. 为了把处理程序附加到可能还未存在于DOM中的DOM元素之上。因为bind是直接把处理程序绑定到各个元素上，它不能把处理程序绑定到还未存在于页面中的元素之上。

2. 如果你运行了$('a').bind(…)，而后新的链接经由AJAX加入到了页面中，则你的bind处理程序对于这些新加入的链接来说是无效的。而另一方面live和delegate则是被绑定到另一个祖先节点上，因此其对于任何目前或是将来存在于该祖先元素之内的元素都是有效的。

3. 或者为了把处理程序附加到单个元素上或是一小组元素之上，监听后代元素上的事件而不是循环遍历并把同一个函数逐个附加到DOM中的100个元素上。把处理程序附加到一个(或是一小组)祖先元素上而不是直接把处理程序附加到页面中的所有元素上，这种做法带来了性能上的好处。

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

网站题目：jQuerybind、delegate、live和on比较-创新互联
本文来源：https://www.cdcxhl.com/article20/dcpoco.html

成都网站建设公司_创新互联，为您提供品牌网站建设、网站营销、网站建设、做网站、App设计、域名注册

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容