jQuery不是选择器不起作用

Posted 2023-03-05

【中文标题】jQuery不是选择器不起作用

【英文标题】：jQuery not selectors not working

【发布时间】：2012-02-02 07:24:47

【问题描述】：

我对 jQuery 选择器有疑问：

$("ul.questions li").not(".title, .content").click().live('click', function()
        $(".inspector").slideToggle();
        if($(this).hasClass("selected")) 
               $(this).removeClass("selected");
         else 
               $(this).addClass("selected");
        
);

在该代码中，如果我删除 .not(".title, .content")，它将起作用。但如果我添加它，它就不会得到点击。我使用live 因为通常元素是通过.append() 添加的，除了一些元素。这是一个例子：http://jsfiddle.net/88w8N/。基本上我想处理对 li 元素的点击，但如果它点击.title 和.content div，则不是。我做错了什么？谢谢！

【参考方案1】：

你需要stop jQuery from triggering an event attached to the parent when the child is triggered。

你需要使用jQuery的event.stopPropagation()函数，它

防止事件在 DOM 树中冒泡，防止任何父处理程序收到事件通知。

具体在您的代码中：http://jsfiddle.net/88w8N/21/

$("ul.questionssel li div, ul.questionsnosel li div").on('click', function(e) 
    e.stopPropagation();
);

更新

要解决您的“实时”问题，请尝试以下修改：http://jsfiddle.net/88w8N/25/

$("ul.questionssel").on('click', 'li', function() 

    //$(".inspector").slideToggle();
    if($(this).hasClass("selected")) 
        $(this).removeClass("selected");
     else 
        $(this).addClass("selected");
    
);

$("ul.questionsnosel").on('click', 'li', function() 
    //$(".inspector").slideToggle();
    if($(this).hasClass("selected")) 
        $(this).removeClass("selected");
     else 
        $(this).addClass("selected");
    
);

$("ul.questionssel li div, ul.questionsnosel li div").on('click', function(e) 
    e.stopPropagation();
);

【讨论】：

好的，由于某种原因，我无法让.on() 使用我的代码，但是基本上相同的 jsFiddle 可以完美运行...：/

jQuery 的.on() 函数是在 1.7 版本中引入的。你用的是什么版本？

我有 jQuery v1.7.1 和 jQuery UI 1.8.16

你查看我的jsFiddle了吗？因为我也对您的代码进行了调整。而不是.click().live('click', function()，我正在做.on('click', function() 。

是的，但是当我使用 .append() 时，不知何故 .on() 不起作用

【参考方案2】：

你可以使用非选择器代替非函数 http://api.jquery.com/not-selector/

【参考方案3】：

尝试:not("...") 而不是.not("...")

请仔细检查这些链接：

http://api.jquery.com/attribute-not-equal-selector/

http://api.jquery.com/not-selector/

http://api.jquery.com/category/selectors/

【讨论】：

我使用了选择器$("ul.questions li:not(div .title)")，所以我检查它是否有效，但我仍然可以单击标题并且仍然调用 click() 操作