欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

“取消”和“停止”浏览器事件

程序员文章站 2022-03-14 09:26:00
...

这种做法是从Bret Taylor的blog上面抄来的,原文地址在这里(好像是,不是也别怪我。)。对于避免ajax应用中不同层的事件干扰很有用的。


先说一下“取消(cancel)”和“停止(stop)”的区别:说白了,停止就是当事件发生后,阻止它自动冒泡到父容器内;而取消则是当冒泡发生到父容器之后停止,也就是不在当前元素中响应。天哪,这东西说起来话长了,代码说话:


function stopEvent(e) {
if (!e) e = window.event;
if (e.stopPropagation) {
e.stopPropagation();
} else {
e.cancelBubble = true;
}
}

var link = document.getElementById("link");
link.onclick = stopEvent;

以上这一段是阻止父容器事件的


function cancelEvent(e) {
if (!e) e = window.event;
if (e.preventDefault) {
e.preventDefault();
} else {
e.returnValue = false;
}
}

var link = document.getElementById("link");
link.onclick = function(e) {
cancelEvent(e);
stopEvent(e);
}

以上这一段是阻止子元素事件的


例子地址在这里:demo