案例代码:
<div onclick="viewType(this);" id="type_select_class" class="selectClass">
<div class="title"><em>类型:</em><span id="current_type_name">全部</span></div>
<ul class="class" id="menu_type_list">
<li onclick="setStyleType('0','全部',event);return false;">全部</li>
<li onclick="setStyleType('001001','可爱',event);return false;">可爱</li>
<li onclick="setStyleType('001002','幽默',event);return false;">幽默</li>
<li onclick="setStyleType('001003','神秘',event);return false;">神秘</li>
<li onclick="setStyleType('007006','东方神起',event);return false;">东方神起</li>
<li onclick="setStyleType('007007','少女时代',event);return false;">少女时代</li>
</ul>
</div>
如上所显示,父类和子标签下都有一个onclick事件,所谓的冒泡就是,点击子类的会连带的触发父类的的事件。从而造成不想要的联动。
解决方案:
<script>
function setStyleType(style_type,sytle_name,event){
//阻止冒泡调用parent
var e = (event) ? event : window.event;
if (window.event) {//IE
e.cancelBubble=true;
} else { //FF
e.stopPropagation();
}
//继续下面的动作。。。。。。
$("#type_select_class").removeAttr("class");
$("#type_select_class").attr("class", "selectClass2");
$("#current_type_name").html(sytle_name);
getItemList();
}
</script>
分享到:
相关推荐
js阻止冒泡 在阻止冒泡的过程中,W3C和IE采用的不同的方法,那么我们必须做以下兼容。 代码如下: function stopPro(evt){ var e = evt || window.event; //returnValue如果设置了该属性,它的值比事件句柄的返回值...
//使用IE的cancelBubble = true来取消事件冒泡 window.event.cancelBubble = true; } 阻止浏览器默认行为-通用方法 //阻止浏览器的默认行为 function stopDefault( e ) { //阻止默认浏览器动作(W3C) if
代码如下:function stopBubble(e){ if(e&&e.... } else{//IE window.event.cancelBubble=true; } } 如果要阻止默认事件的触发,即默认的href事件,那么就需要调用如下函数: 代码如下:function stopD
不过我发现FF支持e.cancelBubble = true;的写法,经测试可行。就把代码贴在这里吧,省得以后到处找。IE以前版本的兼容性还没测试,用到时再完善吧。 代码如下: //取消事件冒泡 function stopBubble(e) { var evt...
1.阻止事件冒泡,使成为捕获型事件触发机制. ... window.event.cancelBubble = true; } 2.当按键后,不希望按键继续传递给如HTML文本框对象时,可以取消返回值.即停止默认事件默认行为. //阻止浏览器的默认行为 functi
在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止...window.event.cancelBubble = true; return false; 2.阻止浏览器的默认行为 JavaScript代码 //如果提供了事件对象,则这是
1. 如何阻止事件冒泡 代码如下://非IE if (event && event.stopPropagation) event.stopPropagation(); else//IE window.event.cancelBubble = true; 2.获取控件ID 代码如下:if (document.all) { //IE alert(...
window.event.cancelBubble = true; } }, // 阻止事件默认浏览器行为 stopDefault : function(ev) { // w3c标准 if (ev && ev.preventDefault) { ev.preventDefault(); } // ie ...
阻止冒泡:1、stopPropagation()对于非IE浏览器。2、cancelBubble属性为true,对于IE浏览器, 而Jquery已经有兼容浏览器的方法,event.stopImmediatePropagation(); <!DOCTYPE html> <html> <head>...
调用事件: ...IE中的事件对象 type 属性 用于获取事件对象, srcElement属性 用于获取事件目标 cancelBubble属性 用于阻止事件冒泡 设置为true是表示阻止 false表示不阻止 returnValue 属性 用于阻止事