事件冒泡 追加方法

<script type="text/javascript">
function gel(id) {return document.getElementById(id);}
window.onload = function () {
var btn = gel("txtName"); //获得按钮对象
//btn.onclick = doClick; //先为按钮对象 onclick事件 设置了一个方法 doClick
// btn.addEventListener("click", doClick, true);
// gel("divC").addEventListener("click", doClick2, true);
// gel("divB").addEventListener("click", doClick3, true);

addEvent(btn, "click", doClick);
addEvent(gel("divC"), ‘click‘, doClick2);
addEvent(gel("divB"), ‘click‘, doClick3);
}
function doClick() {
alert("1");
}
function doClick2() {
alert("doClick2");
}
function doClick3() {
alert("doClick3");
}

function addEvent(obj, eventName, callback) {
if (obj.addEventListener) {
obj.addEventListener(eventName, callback, false);
} else {
obj.attachEvent("on" + eventName, callback);
}
}
</script>
</head>
<body>
<div id="divB">
<div id="divC">
<input id="txtName" type="button" value="测试事件" /><!--onclick="doClick(event)"-->
</div>
</div>
</body>

时间: 2024-10-16 04:21:32

事件冒泡 追加方法的相关文章

js阻止事件冒泡的方法

/********************************************js方法***************************************************/ function doSomething(obj, evt) {    var e = (evt) ? evt : window.event; //判断浏览器的类型,在基于ie内核的浏览器中的使用cancelBubble    if (window.event) {        e.cance

事件冒泡以及取消事件冒泡方法

事件冒泡 以及 取消事件冒泡方法 1. 事件冒泡的原理: 2. 取消事件冒泡的方法: 方法一:return false  (在定义的事件回调函数的后面加上这句代码) 方法二:event. stopPropagation() 方法三:event. preventDefault() (在Chrome浏览器中,失效了) 原文地址:https://www.cnblogs.com/david-lcw/p/10430271.html

JS事件冒泡机制以及委托方法,以及vue中的stop

要理解事件冒泡机制,就得先了解事件. 浏览器是事件驱动型的,根据用户的行为触发不同的事件,根据事件执行相应的操作.我们较为熟悉的事件有三大类型:鼠标键盘事件.页面事件.表单相关事件. 鼠标键盘事件:onclick.ondbclick.onmousedown.onmouseup.onmouseover.onmousemove.onmouseout.onkeypress.onkeydown.onkeyup: 页面事件:onload.onunload.onresize.onerror.onabort:

js之事件冒泡和事件捕获详细介绍

(1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div -> body -> html -> document Mozilla 1.0: div -> body -> html -> document -> window (2)捕获型事件(event capturing):事件从最不精确的对象(document 对象)开

JS事件(事件冒泡和事件捕获)

事件流:描述的是在页面中接收事件的顺序 事件冒泡:由最具体的元素接收,然后逐级向上传播至最不具体的元素的节点(文档) 事件捕获:最不具体的节点先接收事件,而最具体的节点应该是最后接收事件 DOM中:用于处理指定和删除事件处理程序的操作addEventListener()和removeEventListener().他们都接收三个参数:要处理的事件名.作为事件处理程序的函数和布尔值(事件处理的时候)[true:事件捕获时;false:事件冒泡时] DOM中的事件对象: type属性 用于获取事件类

js 事件冒泡和事件捕获

(1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div -> body -> html -> document Mozilla 1.0: div -> body -> html -> document -> window (2)捕获型事件(event capturing):事件从最不精确的对象(document 对象)开

探讨JavaScript的事件冒泡

JavaSciprt事件中有两个很重要的特性:事件冒泡以及目标元素. 当一个元素上的事件被触发的时候,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先元素中被触发.这一过程被称为事件冒泡:这个事件从原始元素开始一直冒泡到DOM树的最上层.天台县羿壮冶金 任何一个事件的目标元素都是最开始的那个元素,在我们的这个例子中也就是按钮,并且它在我们的元素对象中以属性的形式出现.使用事件代理的话我们可以把事件处理器添加到一个元素上,等待一个事件从它的子级元素里冒泡上来,并且可以很方便地得知这个事

JavaScript事件冒泡与捕获

event.preventDefault();    如果event.cancelable的值为true,可以取消默认事件 event.cancelable;             元素是否可以取消默认事件,true可以取消,false不可以取消,IE8不支持 event.cancelBubble;         true:设置当前事件不冒泡,false:设置当前事件冒泡 event.stopPropagation();  停止当前事件的分发,不论当前事件是在冒泡还是在捕获阶段 事件--怎样

js区分鼠标单双击 阻止事件冒泡

function clickOrDblClick(obj) { count++; if (obj != undefined) { var rowStr = $.trim($(obj).find("td:eq(1)").text().replace(/※/g, '')); currentRowpm = rowStr; } timer = window.setTimeout(function(obj) { var currentTr = $("#tbMainDeputy"