Question

$('body').on( "click", "body:not(nav)", function(e) {

上述情况根本不会发生。我试图这样做，如果我点击除导航之外的身体的任何部分，那么它将做一些事情

Answer 1

试试这个：

<body>
    <div id="nav">NAV</div>
    <div id="other">Others</div>
</body>

的jQuery

$('html').on('click', function (e) {

    if ($(e.target).attr('id') != 'nav') {
        // CLICKED SOME WHERE ELSE
    }


});

JSFIDDLE：http://jsfiddle.net/65kbm/2/

Answer 2

<强> JS

 $('body').on('click', function(e) {

  if(e.target == '#navid') {
     e.stopPropagation();
  }

});

Answer 3

$('body').on('click', function(e) {
    var thisnav = e.target;
    if (!$(thisnav).hasClass('site-nav')) {
        //the code
    }
});

Answer 4

你需要递归 - 因为你可以点击导航中的孩子我改进了@sravis演示

＆＃13;

function goUp(element) {
	console.log(element);
  if(element.is("html") || element == undefined) {
    return false;
  }
  else if(element.is("nav")){
    return true;
  }
  else{
   return goUp(element.parent());
  }
}

$(document).ready(function () {
    $('html').on('click', function (e) {
			console.log("--------------------");
      if (goUp($(e.target))) {
        console.log('you clicked on nav');
      } 
      else {
        console.log('clicked some where else');
      }
    });
});

＆＃13;

body {
    background-color: #ccc;
}
nav {
    background-color: #foo;
}
#other {
    background-color: #c81d87;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
    <nav>
      <div>
        <span>NAV</span>
      </div>
    </nav>
    <div id="other">Others</div>
</body>

＆＃13;

或

http://jsfiddle.net/65kbm/14/

jQuery单击body但不导航

4 个答案: