javascript - 別のクリックイベント後の $('html').click イベント

Question

目的：

1. (#clickme) をクリックすると、DIV が下にスライドして表示され、(var isclicked = true)
2. (var isclicked = true) で (#clickme) をクリックすると、DIV が上にスライドし、(var isclicked = false)
3. (var isclicked = true) で DIV が表示されているときに、$('html') をクリックすると DIV が上にスライドし、(var isclicked = false)

問題: DIV が slideDown の位置にある間 (var isclicked = true)、$('html') をクリックすると起動し続けます。$('html') のクリック時にのみ DIV is (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/

Answer 1

$('body')の代わりに使用$('html')

このJSFiddleを参照してください