Question

<script>
$(document).ready(function() { 
   alert("22");

   $('.clickme').click(function(){
       $('#popup_box1').toggleClass('opacityfilter');
 });
 });
</script>

<style>
.opacityfilter {
    _position:absolute; /* hack for internet explorer 6 */       
    height:350px;       
    width:600px;       
    background:#FFFFFF;       
    left: 33%;/*300px;     */
    right:30%;
    text-align:left;
    top: 150px;     
    z-index:100;      
    margin-left: 0;           
    padding:15px;       
    font-size:15px;       
    -moz-box-shadow: 0 0 15px #ff0000;     
    -webkit-box-shadow: 0 0 15px #ff0000;     
    box-shadow: 0 0 15px lightblue;
    background-color: rgba(255, 255, 255, 0.9); /* Color white with alpha 0.9*/
    filter:alpha(opacity=50); opacity:0.5;
    }
</style>
<a class="clickme">
 <div id="popup_box1" class="opacityfilter"> 
 click here</div>
 </a>

请告诉我，当点击页面上的任何地方时div标签将如何显示，但如果用户点击div区域，则div应该消失，但该div的内容应该对用户可见

Answer 1

您必须附加click的{{1}}处理程序，您必须做出决定取决于document。

尝试，

e.target

正如帕夫洛所说，你可以将其作为单行代码，如

  $(document).click(function(e){   
       if($(e.target).is('.clickme')){
           // show the div
       }
       else {
           //hide the div
       }
  });

Answer 2

试试这个：

 $(document).click(function(event) {
      var target = $(event.target);
      if (target.attr('id').match(/^mydiv/)){
            //on div
      }else{
            //on body
      }
});

参考 here。

当我点击div区域时，div应该消失，当我点击页面中的任何地方时div应该出现

2 个答案: