jQuery中的事件
函数名 | 说明 | 例子 |
bind(type,[data],fn) | 为匹配元素的指定事件添加事件处理函数 data为可选参数,data为数组 |
function secondClick() { alert("second click!"); } $("#dv1").bind("click", secondClick); |
one(type,[data],fn) | 为匹配元素的指定事件添加一次性事件处理函数 通过fn函数的参数的data属性可获取值 |
//数据通过fn的参数传递过去 // 例如fn的参数是e,则在fn内部可以通过e.data获取设定的参数 $("#dv1").one("click", { name: "zzz", age: 20 }, function (e) { alert(e.data.name); }); |
trigger(event,[data]) | 在匹配的元素上触发某类事件 此函数会导致浏览器同名的默认行为被执行 data为可选参数,data为数组 | 见下例 |
triggerHandler(event,[data]) | 触发指定的事件类型上所绑定的处理函数 不会执行浏览器默认行为 | 见下例 |
unbind(type,fn) | 为匹配的元素解除指定事件的处理函数 |
//如果没有参数,则解除匹配元素的所有事件处理函数 $("#dv1").unbind(); //如果提够了事件类型参数,则只删除该事件类型的处理函数 $("#dv1").unbind("click"); //如果把绑定时传递的处理函数作为第二个参数传递,则只删除该处理函数 $("#dv1").unbind("click", secondClick); |
事件切换
事件切换方法有以下两个:
函数名 说明 hover(over,out) 一个模仿悬停事件的方法.
over:鼠标移到元素上要触发的函数
out:鼠标移出元素要触发的函数toggle(fn,fn) 每次点击后,依次触发函数
如果点击了一个匹配的元素后,则执行指定的第一个事件处理函数;
当再次点击该元素时,会执行下一个事件处理函数;
如果有更多函数,则依次触发,直到最后一个,然后循环调用.
Query事件对象
属性名 | 说明 |
currentTarget | 冒泡前的当前事件的Dom对象,等同于this |
data | 事件调用时传递的数据 |
result | 上一个事件处理函数返回的值 |
target | 获取事件触发者的Dom对象 |
timeStamp | 事件发生的时间戳 |
type | 事件类型 |
jQuery事件对象的函数:
函数名 | 说明 | 例子 |
preventDefault() | 取消元素事件的默认动作 例如: 对于超级链接a来说,有href属性,那么在点击a的时候就会导航至href所指向位置.我们再a的click事件中,调用本方法,就不会导航到指定位置 |
//取消事件默认动作 $("a").bind("click", function (e) { e.preventDefault(); }); |
isDefaultPrevented() | 是否调用过preventDefault()方法 |
e.isDefaultPrevented() |
stopPropagation() | 取消事件冒泡 |
e.stopPropgation(); |
isPropagationStopped() | 是否调用过stopPropagation()方法 |
e.isPropagationStopped() |
stopImmediatePropagation() | 取消执行该元素该事件处理函数的后续事件处理函数, 并取消事件冒泡 |
$("a").bind("click", function (e) { e.stopImmediatePropagation(); }); //不会被执行到 $("a").click(function () { alert("我被点击了"); }); |
isImmediatePropagationStopped() | 是否调用过stopImmediatePropagation()方法 |
$("a").bind("click", function (e) { e.stopImmediatePropagation(); alert(e.isImmediatePropagationStopped()); }); |