Toggle ausblenden nicht

Question

woking

Ich habe einen einfachen Code, ich will ein div verstecken, wenn Anwender auf andere div.container oder button innerhalb dieser hier div ist mein Code

$('div, button').click(function(){ 
 
    $('.div').toggle('hide'); 
 
})

div{ 
 
    height: 200px; 
 
    width: 200px; 
 
} 
 
.container{ 
 
    background: pink 
 
} 
 
.div{ 
 
    background: blue 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"> 
 
    <button>Click</button> 
 
</div> 
 
<div class="div"></div>

seine Arbeit gut, wenn ich auf container div, aber es funktioniert nicht, wenn ich auf den Button klicken, ich weiß, das Problem ist, dass Sie einen Klick zweimal drücken. aber wie sie beheben, dass

Answer 1

Sie das DOM stoppen kann, dass durch die Verhinderung der Click-Ereignis von sprudeln und das Auslösen des Click-Ereignis auf dem Elternteil mit .stopPropagation():

$('div, button').click(function(e){ 
 
    e.stopPropagation(); 
 
    $('.div').toggle('hide'); 
 
})

div{ 
 
    height: 200px; 
 
    width: 200px; 
 
} 
 
.container{ 
 
    background: pink 
 
} 
 
.div{ 
 
    background: blue 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"> 
 
    <button>Click</button> 
 
</div> 
 
<div class="div"></div>

Answer 2

Verwendung unter Jquery für das Problem.

$('.container, button').click(function(){ 
     $('.div').toggle(500); 
     return false; 
    }) 

Answer 3

Bitte versuchen Sie diese

$('div, button').click(function(){ 
    $('.div').toggle('hide'); 
    console.log("hello"); 
    return false; 
})