$（this）除了特定的孩子

我试图运行一个函数，如果你点击李的任何地方，除了特定的按钮（在这种情况下发生其他事情）。看来我应该使用.not或：not，但是尝试下面的任一个会导致错误并阻止函数的执行。

编辑：加入jsfiddle Demo 该代码遵循Blender的建议，通过切换live> on和使用他的语法，但是这并没有解决问题。

的Javascript：

$('#currentThread').on('click', 'li:not(.chromeElement)', function() { 
    $(this).find('.hiddenChrome').slideToggle(); 
});

HTML：

<div id='thunderdome'> 
    <section id='middle'> 
     <ul id='currentThread'> 
      <li class="c1L9zObS"> 
       <article> 
        <img src="http://www.gravatar.com/avatar/ae7238730d03d6da0df35cd8a96ee4dc?d=identicon" class="userPic"> 
        <p class="body">foo reply to op</p> 
       </article> 
       <p class="byline">By <span class="user">raurus</span><span class="timestamp">; Posted a while ago</span><span class="context">2 Tangents</span> 
       </p> 
       <div class="hiddenChrome" style="display: none;"> 
        <div class="chromeElement star"> 
         <p>Star</p> 
        </div> 
        <div class="chromeElement report"> 
         <p>Report</p> 
        </div> 
        <div class="chromeElement delete"> 
         <p>Delete</p> 
        </div> 
        <div class="chromeElement edit"> 
         <p>Edit</p> 
        </div> 
        <div class="chromeElement vote unvoted isLoggedIn"></div> 
       </div> 
       <hr> 
      </li> 
     </ul> 
    </section> 
</div>

的目标是，你可以点击任何地方里，它会展开显示你.hiddenChrome

的问题是，单击一个.chromeElement会导致第一个函数执行，而.hiddenChrome会切换回来。我想让它点击任何/但/ .chromeElement使该函数执行。

我不想使用.slideDown（）作为切换是所需的行为。

来源

2013-04-26 Henry Marshall

should't是富（）？ – letiagoalves 2013-04-26 19:47:49

除了'.live'被弃用并在jQuery 1.9中删除之外，它不支持链接！ http://api.jquery.com/live/。你得到'未捕获的SyntaxError：意外的令牌; '因为你错过了关闭'）'。 – 2013-04-26 19:48:34

您可以使用on这样一个更简洁的代表团是

$('#currentThread').on('click', 'li:not('.chromeElement)'), function(){ 
    foo(); 
});

相匹配的问题。然而，你问是当事件对孩子出现在父母停止活动。我认为你需要做两件事情：如果排除孩子则事件仍会触发父项目和任何“空间”，它占用（包括儿童）

所以把一个事件处理程序，并在逻辑上将其排除当事件触发时
使用逻辑来检测事件在哪个项目上启动并终止处理程序。

这样的：

 $('#currentThread').on('click', 'li, .chromeElement', function (e) { 
     var $this = $(this); 
     if ($this.closest('.chromeElement').length > 0) { 
     // if the click occurs on a chromeElement member then bail 
      return false; 
     } else { 
      $this.find('.hiddenChrome').slideToggle(); 
     } 
    });

your fiddle modified

来源

2013-04-26 21:47:03 gillyspy

你的前两个例子没有结束括号：

$('li').not('.chromeElement').live('click', function(){ 
    foo 
}); 
^ 


$('li:not(.chromeElement)').live('click', function(){ 
    foo 
}); 
^

此外，.live()已在jQuery的1.9及以上的去除。与.on()替换为：

$(document).on('click', 'li:not(.chromeElement)', function() { 
    foo(); 
});

更改document到最接近的非动态创建的父元素的选择。

来源

2013-04-26 19:49:24 Blender

$（this）除了特定的孩子

回答

相关问题