以下代码中的 alert() 应该是在 鼠标离开 divPromptBox 时才被执行,但是当鼠标碰到其中的 <a> <div> <span>都会被触发,网上翻了翻也没找到比较好的可以通用的解决方法,特来此一问。
------
<div id="divPromptBox" class="PromptBox" style="width: 50%;" onmouseout="alert('');">
<a href="#">...</a>
<div>...<div>
<span>...</span>
</div>
------
<div id="divPromptBox" class="PromptBox" style="width: 50%;" onmouseout="alert('');">
<a href="#">...</a>
<div>...<div>
<span>...</span>
</div>
//一般用在鼠标或键盘事件上
if(e && e.stopPropagation){
//W3C取消冒泡事件
e.stopPropagation();
}else{
//IE取消冒泡事件
window.event.cancelBubble = true;
}
};<div id="divPromptBox" class="PromptBox" style="width: 50%;" onmouseout="alert('');stopBubble(this);">
<script>
if(typeof(HTMLElement)!="undefined")
HTMLElement.prototype.contains=function(obj)
{
if(obj==this)return true;
while(obj=obj.parentNode) if(obj==this) return true;
return false;
}
function doit(evt){
evt = window.event?window.event:evt;
var obj = evt.toElement || evt.relatedTarget
if(document.getElementById("divPromptBox").contains(obj)) return;
alert('');
}
</script>
<div id="divPromptBox" class="PromptBox" style="width:50%;background:#ccc" onmouseout="doit(event);">
<a href="#">... </a>
<div>... <div>
<span>... </span>
</div>