$(document).on('click', selector, function() )结合:not

Question

我有几个列表项，当我点击其中一个项目时，希望浏览器重定向到“.title > a”链接（href）。但是我不想在“notThis”选择器上触发任何事件。 请参考以下示例： http://jsfiddle.net/VTGwV/29/

<div class="item">
<div class="title">
    <a href="www.jsfiddle.net">jsfiddle.net</a>     
</div>
<div> djføljdsaføljdsf a</div>
<div> djføljdsaføljdsf a</div>
<div> djføljdsaføljdsf a</div>
<div class="notThis">
    <a href="/test.html">link1 </a>
    <a href="/test2.html">link2</a>                
</div>

​

script

​$(document).on('click', '.item', function(event) {
    window.location.href = $(event.currentTarget).find('.title > a').attr('href');        
});​

我尝试过使用:not('.notThis')，但没有成功。

更改 感谢所有的答案，但我发现另一个问题。如果我在整个项目上有一个事件处理程序，我无法成功点击“notThis”选择器中的链接，因为它只返回“false”。难道不能在$(document).on('click', -------)中结合使用.not / :not吗？

- Plexus81

---

你是在谈论我解决方案中的 return false 吗？那就直接使用 return;。当然，你可以在 .on 中使用 :not，但这对你的情况没有帮助。 - Felix Kling

就像我之前所说的，把return false;改成return;: http://jsfiddle.net/VTGwV/30/ - Felix Kling

如果我在整个项目上有一个事件处理程序，我就无法成功点击“notThis”选择器中的链接 - 尝试我的变体，它没有这样的问题。只会捕获所需元素上的点击。 - Artem Koshelev

Answer 1

你可以测试点击事件是否来源于.notThis元素（或元素本身）：

$(document).on('click', '.item', function(event) {
    if($(event.target).closest('.notThis').length > 0) {
        return false; // if you want to ignore the click completely
        // return; // else
    }
    window.location.href = $(event.currentTarget).find('.title > a').attr('href');
});​

我认为你也可以使用 this 代替 event.currentTarget。

- Felix Kling

---

如果 event.target 是 <div class="notThis"> 元素会发生什么？ .closest('.notThis') 仍然会匹配，因此结果将是一个具有大于0的长度属性的 jQuery 对象吗？ - Anthony Grist

@Anthony：是的。*"描述：获取与选择器匹配的第一个元素，从当前元素开始并沿DOM树向上进行。"* - Felix Kling

谢谢。在询问之前，我应该自己先查看文档。 - Anthony Grist

不要认为可以使用$(this)。如果您在“notThis”之前单击div，则不会找到“title”。但是，如果我将find（）更改为closest，它将起作用。 - Plexus81

this 应该始终指向 div.item，因为事件处理程序已经设置好来处理它们的点击事件。这对我起作用：http://jsfiddle.net/VTGwV/28/ - Felix Kling

Answer 2

你的语法有误，请像这样使用选择器：

示例

$("div.item > div:not(.notThis)").click(function(){
    window.location.href = $(this).find('.title > a').attr('href');
});

- akalucas

---

语法没有问题...你为什么这样说？ - Felix Kling

еңЁеҺҹеё–дёӯпјҢ@plexus81иҜҙд»–дҪҝз”ЁдәҶ:not('.notThis')дҪҶжҳҜжІЎжңүиө·дҪңз”ЁпјҢеә”иҜҘдҪҝз”Ё:not(.notThis)дёҚеёҰеј•еҸ·гҖӮиҝҷе°ұжҳҜжҲ‘д№ӢеүҚиҜҙзҡ„еҺҹеӣ гҖӮ - akalucas

Answer 3

http://jsfiddle.net/Lcg49/4/

var clickable = $('.item').find('div').not('.notThis');

$(clickable).on('click', function(event) {
    alert($(this).parent().find('.title a').attr('href'));
});

- Artem Koshelev