返回> 网站首页

div mouseout弹出隐藏漂浮框问题

yoours2009-04-03 23:11:56 阅读 1016

简介一边听听音乐，一边写写文章。

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]);});

微信小程序扫码登陆

文章评论

1016人参与，0条评论

标签云