$('html'）.单击一个又一个单击事件

$('html').click event after another click event

本文关键字：单击 一个又一个 事件 html      更新时间：2023-09-26

意图：

  1. 点击（#clickme），DIV向下滑动并进入视图，（var isclicked=true）
  2. 当（var isclicked=true）和点击（#clickme）时，DIV向上滑动（var iscricked=false）
  3. 当（var isclicked=true）和DIV在视图中时，单击$（'html'）将DIV向上滑动（var iscricked=false）

问题：当DIV处于slideDown位置时（var isclicked=true），点击$（'html'）时会继续激发。我错过了什么，以至于点击o$（'html'）时只触发DIV（var isclicked=true）

var isclicked = false; 
$('#clickme').click(function(event){
  doslider();       
  console.log(isclicked);    
  if(isclicked == true){
     $('html').click(function(event){
         console.log('is box opened? '+isclicked);
     });        
  } 
});

function doslider(){     
 if(isclicked == false){    
     $('#myslider').slideDown('slow');         
       isclicked = true;                
 }else{
     $('#myslider').slideUp('slow');
       isclicked = false;          
 }   
 return isclicked; }

JSFiddle：http://jsfiddle.net/7Zfwx/92/

放弃全局isClicked var，只使用slideToggle:

$("#clickme").click(function(e) {
    e.stopPropagation();
    $("#myslider").slideToggle("slow");
});
$("body").click(function() {
    $("#myslider").is(":visible") ? $("#myslider").slideUp("slow") : 0
});

演示：http://jsfiddle.net/7Zfwx/103/

记得先停止（并完成）上一个动画：

if(isclicked == false){    
    $('#myslider').stop(true, true).slideDown('slow');
      isclicked = true;       
}else{
    $('#myslider').stop(true, true).slideUp('slow');
      isclicked = false;   
}

演示：http://jsfiddle.net/maniator/7Zfwx/94/

使用$('body')而不是$('html')

请参阅此JSFiddle

相关文章：