js中onMouseOut事件冒泡的问题
在做页面的弹出漂浮窗体。例如下拉菜单时onmouseout让人非常不可思议,解决办法如下:
一、给标签增加事件监听 方法
function addEvent(el, evname, func)
{
if (el.attachEvent)
{
el.attachEvent("on" + evname, func);
}else if (el.addEventListener){
el.addEventListener(evname, func, true);
}
};
二、给firefox定义contains()方法,ie下不起作用(ie自身带有)
if(typeof(HTMLElement)!="undefined")
{
HTMLElement.prototype.contains=function(obj)
{
//通过循环对比来判断是不是obj的父元素
while(obj!=null&&typeof(obj.tagName)!="undefind")
{
if(obj==this)
return true;
obj=obj.parentNode;
}
return false;
};
}
三、隐藏函数
function HideMyFunc(theEvent)
{
if (theEvent)
{
var browser=navigator.userAgent;//取得浏览器属性
if (browser.indexOf("Firefox")>0)
{
//如果是Firefox
if (document.getElementById('divModifyCategory').contains(theEvent.relatedTarget))
{
//如果是子元素
return;//结束函式
}
}
if (browser.indexOf("MSIE")>0)
{
//如果是IE
if (document.getElementById('divModifyCategory').contains(event.toElement))
{
//如果是子元素
return; //结束函式
}
}
}
//要执行的操作 隐藏或者是删除标签
var divModifyCategory = document.getElementById("divModifyCategory");
if (divModifyCategory)
{
window.document.body.removeChild(divModifyCategory);
}
}
四、为自创建的标签增加响应事件
addEvent(divModifyCategory, 'mouseout', function(){HideMyCategory(arguments[0]);});
在做页面的弹出漂浮窗体。例如下拉菜单时onmouseout让人非常不可思议,解决办法如下:
一、给标签增加事件监听 方法
function addEvent(el, evname, func)
{
if (el.attachEvent)
{
el.attachEvent("on" + evname, func);
}else if (el.addEventListener){
el.addEventListener(evname, func, true);
}
};
二、给firefox定义contains()方法,ie下不起作用(ie自身带有)
if(typeof(HTMLElement)!="undefined")
{
HTMLElement.prototype.contains=function(obj)
{
//通过循环对比来判断是不是obj的父元素
while(obj!=null&&typeof(obj.tagName)!="undefind")
{
if(obj==this)
return true;
obj=obj.parentNode;
}
return false;
};
}
三、隐藏函数
function HideMyFunc(theEvent)
{
if (theEvent)
{
var browser=navigator.userAgent;//取得浏览器属性
if (browser.indexOf("Firefox")>0)
{
//如果是Firefox
if (document.getElementById('divModifyCategory').contains(theEvent.relatedTarget))
{
//如果是子元素
return;//结束函式
}
}
if (browser.indexOf("MSIE")>0)
{
//如果是IE
if (document.getElementById('divModifyCategory').contains(event.toElement))
{
//如果是子元素
return; //结束函式
}
}
}
//要执行的操作 隐藏或者是删除标签
var divModifyCategory = document.getElementById("divModifyCategory");
if (divModifyCategory)
{
window.document.body.removeChild(divModifyCategory);
}
}
四、为自创建的标签增加响应事件
addEvent(divModifyCategory, 'mouseout', function(){HideMyCategory(arguments[0]);});