jQuery事件机制

xiaoxiao2021-02-28  42

jQuery事件机制

事件的注册

普通的注册简单的事件,缺点只能注册一个事件

$("p").click(function(){ alert("简单的事件"); })

bind方式注册事件

$("p").bind({ click:function(){ alert('这是bind的click事件'); }, mouseenter:function(){ alert('这是bind的mouseenter事件'); } })

委托事件 delegate

$("div").delegate("p","click",function(){ alert("这是一个委托事件"); })

要给div注册一个委托事件,但是最终不是div执行的,而是p执行。

第一个参数指明事件由谁来执行。

第二个参数是事件的类型

第三个从参数,函数

发展到on事件,既可以委托,又可以做普通事件

$("div").on("click","p",function(){ alert("on的委托事件"); }) $("#btm").on("click",function(){ alert("你点击的是on的普通事件"); })

一般建议用on来注册事件,如果是用jq动态添加元素,而元素又有事件,那么要使用委托事件才能使元素带有事件。

事件的解绑

unbind方式(一般不用)

$(selector).unbind();//解绑所有事件 $(selector).unbind("click");//解绑指定事件

undelegate(一般不用了)

$(selector).undetegate(); $(selector).undetegate();

off推荐使用的方式

$(selector).off();//解绑所有事件 $(selector).off("click");//解绑指定事件

触发事件

$("#btn").on("click",function(){ $("p").click(); $("p").trigger("click"); })

阻止冒泡事件

$("a").on("click",function(e){ alert("onclick"); //return false; //阻止浏览器默认行为和事件冒泡 e.preventDefault(); //阻止浏览器默认行为 e.stopPropagation();//阻止冒泡 })
转载请注明原文地址: https://www.6miu.com/read-53866.html

最新回复(0)