点（回复）显示本留言的回复div 点别的区域div隐藏的问题..

就是很多留言每个留言都有回复连接点击后显示回复对话框点别的区域消失，就和平时网站上的一样，一次只显示一个回复留言框...不知道怎么下手，只能点开不能点击别的区域关闭....
第一步：在js中定义一个变量用来保存鼠标是否在div中这个状态：var isOut=true;(默认不再区域中)
第二步：在div中加上onmouseover和onmouseout事件，用来控制变量isOut：
<div id="codediv" onmouseover="isOut=false" onmouseoout="isOut=true"/>
第三步：在显示div的事件中加入取消事件冒泡的语句：(因为这个事件也会触发document.onmousedown)
event.cancelBubble=true;
第四步：为document添加onmousedown事件：
document.onmousedown=function(){
   var codediv=document.getElementById("codediv");
   if(codediv.style.display!="none" && isOut){
      codediv.style.display!="none";
   }
}这个是找的一个解决办法可是没反应能不能解释一下，我把他简化
document.onmousedown=function(){
   var codediv=document.getElementById("codediv");
   if(codediv.style.display!="none"){
      codediv.style.display="none";
   }
就是不管点哪里都关闭...<div id="codediv" onmouseover="isOut=false" onmouseoout="isOut=true"/>
div里貌似没有这两个事件...
求解法...

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

楼主的意思是元素取得焦点是<div id='message'>...</div>显示，也就是 onclick display:block
然后点击其他元素的时候 #message 隐藏，可以试试 onblur 事件，支持div标签的http://www.w3school.com.cn/htmldom/event_onblur.asp
或者用JQuery $("[id!='message']").mousedown
实现思路是：
判断被鼠标按下时的元素的所有父元素中是否包含了codediv，没有包含则可以知道鼠标是在codediv之外单击的，则隐藏。还是jquery给力啊，给个jquery实例供参考：$(document).mouseup(function(event){
    if($(event.target).parents("#codediv").length==0){
        $("#codediv").hide();
    }
})
onblur div里没有回复的textarea里有结果是输入后点提交直接隐藏了...==！ form a 里也有试了不管用....
突然发现那个onmouseout给的代码是错的...==！
改完加了个window.onload 事件初始化了一下isOut能用了...
...囧看不懂...= =！木有知道jquery...
document.onmousedown=function(){
  var codediv=document.getElementById("codediv");
  if(codediv.style.display!="none"){
  codediv.style.display="none";
  }
这句话的意思，是给页面绑定个鼠标按下事件，此事件是如果ID为codediv的元素不是隐藏的就让它隐藏。
我以为我在抓重点说来着。你可能没有理解我的理解吧？<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE> New Document </TITLE> </HEAD> <BODY>
  <div>
      <a href="#" onclick="document.getElementById('codediv').style.display = '';">单击此处弹出窗口</a>
      任意弹窗外单击会隐藏
      <div id="b" style="padding:100px;border:1px solid red">       <div id="codediv" style="display:none;border:1px solid green;padding:50px;">
              <div>假设这是一个弹窗</div>
      <textarea style="width:400;height:400">留言</textarea>
  </div>
  </div>
  </div> </BODY>
</HTML>
<script>
    function parents(elem,findId){
if(elem.id == findId){
return true;
}
while(elem.parentNode){
    elem = elem.parentNode;
            if(elem.id == findId){
return true;
}
}
return false;
    } document.body.onmouseup = function(event){
event = event ? event.target : window.event.srcElement;
if(!parents(event,'codediv')){
document.getElementById('codediv').style.display = 'none';
}
}</script>
上面写的不会牵扯冒泡问题，由于对原生态js也不是太熟。请参考
灰常感谢 diyle 提供的代码~~
不过我把那个调试好了~~
还要对js好好看看囧了个去的...表示连对象都不知道 = =！
哎要加油了...

点（回复）显示本留言的回复div 点别的区域div隐藏 的问题..

解决方案 »

点（回复）显示本留言的回复div 点别的区域div隐藏的问题..