js和css求助

Question

如题： 页面结构,
<div class="d_1">
   <div class="d_2>内容一</div>
   <div class="d_2">
       <div class="d_3">内容</div>     
   </div>
</div>
类似如上例中的div元素，如何在点击最外层div以外的地方时让整个div组件失去焦点后隐藏请高手赐教 谢谢

Answer 1

jquery:$(document).bind("click", function (e) {
    if($(e.target).closest("div.d_1").is("div.d_1")){
         //点击的div.d_1或div.d_1的内部元素
    }else{
         //点击的div.d_1以外的地方
         $("div.d_1").css("display","none");
    }
}); 

Answer 2

可不可以不用jQuery啊，本人是刚学js没多久，不太会用jQuery，想用纯js实现，有办法吗

Answer 3

...
<script language="javascript" type="text/javascript" src="operation.js"></script>    //加入JS文件，路径一定要正确
...
<div id="d_1" class="d_1" onmouseout="operation()">    //在鼠标离开时调用js的operation方法，别忘了加上id
   <div class="d_2>内容一</div>
   <div class="d_2">
       <div class="d_3">内容</div>     
   </div>
</div>
operation.jsfunction operation(){
     var operation = document.getElementById('d_1');
     operation.style.display = "none";
}这个冒似只能当鼠标移到其它地方时就隐藏。

Answer 4

<div id="content" class="d_1" tabindex="0">  
    <div class="d_2">内容一</div>  
    <div class="d_2">  
     <div class="d_3">内容</div> 
    </div> 
</div>
<script type="text/javascript">   
document.getElementById('content').onblur = function(){   
document.getElementById("content").style.display = "none";
            return false;   
        }   
</script>js 要放到div后面，如果放到前面没有效果

Answer 5

你下个jquery.js下来
那个代码之前将jquery.js载入进来就可以了.<script language="javascript" type="text/javascript" src="jquery.js"></script>
<script language="javascript">
$(document).bind("click", function (e) {
    if($(e.target).closest("div.d_1").is("div.d_1")){
         //点击的div.d_1或div.d_1的内部元素
    }else{
         //点击的div.d_1以外的地方
         $("div.d_1").css("display","none");
    }
}); 
</script>
自己写JS会复杂得多.

Answer 6

感谢各位前辈的指导 开始学习jquery