鼠标点击div区域之外的地方后隐藏div

鼠标点击div区域之外的地方后隐藏div

 用div做了一个code选择器，但div打开之后我想实现点击其他区域就可以自动隐藏的效果，最后解决方法：

第一步：在js中定义一个变量用来保存鼠标是否在div中这个状态：var isOut=true;(默认不再区域中)

第二步：在div中加上onmouseover和onmouseout事件，用来控制变量isOut：

<div id="codediv" οnmοuseοver="isOut=false" onmouseoout="isOut=true"/>

第三步：在显示div的事件中加入取消事件冒泡的语句：(因为这个事件也会触发document.onmousedown)

event.cancelBubble=true;

第四步：为document添加onmousedown事件：

document.οnmοusedοwn=function(){

   var codediv=document.getElementById("codediv");

   if(codediv.style.display!="none" && isOut){

      codediv.style.display!="none";

   }

}

OK。

备注：document .onclick事件也行，但要保证页面中其他控件没有用到这个事件，不然可能会发生冲突。

2009-05-08

 

 

 

posted on 2009-05-08 15:58  大丫洋芋 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/huadd/archive/2009/05/08/1452717.html