點擊其他地方div消失

點擊其他地方div消失

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>點擊其他地方div消失</title>
  <style>
      #b{
          width:300px;
          height:300px;
          border:1px solid black;
          display:none
      }
  </style>
</head>

<body>
    <button id="a">aaa</button>
       
    <div style="" id="b">
        <p>看什麼看</p>
        <p>看什麼看</p>
    </div>
    <script>
  function e(obj){
    return document.getElementById(obj)
  }
  e('a').onclick = function (event) {
      e('b').style.display = 'block';
    stopBubble(event);
    document.onclick=function(){
        e('b').style.display = 'none';
   document.onclick=null; 
    }
  }

  e('b').onclick = function (event) {
    stopBubble(event);
  }
  
  function stopBubble(e){
    if(e && e.stopPropagation){
      e.stopPropagation();  
    }else{
      window.event.cancelBubble=true; 
    }
  }
    </script>
</body>
</html>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章