如何从 jquery.click 事件中排除特定的 div

Question

我想在单击 foo 时排除警报，但当我单击 body 上的任何地方（包括 foo）时它仍然会发出警报。 下面的 Jquery 没有按预期工作。

$("body:not(.foo)").click(function(){   alert("clicked body");    });

$("body:not(.foo)").click(function()
{
 alert("clicked body");
});

body {  background: #e8e6e4;  padding: 20px;  font-family: Helvetica;border:2px solid;}
.foo{  color:#ffffff;  background:red;}
button {  background: #0084ff;  border: none;  border-radius: 5px;
  padding: 8px 14px;  font-size: 15px;  color: #fff;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<body>
<div>
  <p>Hello World</p><button>Change color</button>
</div>
<br><br><br><br><br><br>
<div class="foo">FOOOO</div>
</body>

Answer 1

单击 .foo div 时，您可以 return false。 see demo

$('div.foo').on('click', function() {
  return false;
});

Answer 2

这是我的做法：

$(document).on('click', function()
{
    if (!$(this).hasClass('foo')) {
        //do something
    } 
}) ;

如何从 jquery.click 事件中排除特定的 div

How to exclude a specific div from jquery .click event

html

jquery

jquery-selectors