如何使用 jQuery 选择除 select 元素之外的所有子元素

How do I use jQuery to select all children except a select element

提问by Shawn J. Goff

I have a div (let's say the id is "container") with many elements in it, including a select element. I'd like to select all everything in the div except the select. Things I've tried:

我有一个 div（假设 id 是“容器”），其中包含许多元素，包括一个 select 元素。我想选择 div 中除选择之外的所有内容。我尝试过的事情：

$("#container *:not(select)")
$("#container *:not(#selectorid)")

//put a div around the select and...
$("#container *:not(#selectorcontainer)")
$("#container *:not(#selectorcontainer *)")
$("#container *:not(#selectorcontainer, #selectorcontainer *)")

Also tried without wildcard descendant selector, so just like all the above, but

也试过没有通配符后代选择器，所以就像上面所有的一样，但是

$("#container:not(#selectorid)")

回答by Martijn Pieters

You can simply omit the wildcard as it is optional in this case, but keep the space:

您可以简单地省略通配符，因为在这种情况下它是可选的，但保留空格：

$('#container :not(select)');

Alternatively, use the .not() method to filter out the select after selecting all children:

或者，使用 .not() 方法在选择所有子项后过滤掉选择：

$('#container').children().not('select');

If your problem is that children of selectare still included, you could explicitly filter those out with the .not() method:

如果您的问题是select仍然包含 的孩子，您可以使用 .not() 方法显式过滤掉那些：

$('#container').children().not('select, option, optgroup');

or select direct children only:

或仅选择直接子项：

$('#container > :not(select)');

You can try out jQuery selectors at the interactive jQuery selector testerfor quick feedback; try for example div :not(ol)or div > :not(ol)to get a feel for what difference the direct child (>) selector makes.

您可以在交互式 jQuery 选择器测试器中试用 jQuery 选择器以获得快速反馈；例如，尝试div :not(ol)或div > :not(ol)感受一下直接子 ( >) 选择器有什么不同。

回答by Sampson

Using :not, and .not()to select and filter » Live Demo

使用:not, 和.not()来选择和过滤 »现场演示

The :not(selector)does exactly this, and it comes in a couple styles. You can use the selector, or the method. Below is an example of using the selector:

的:not(selector)正是这样做的，并且它有一对夫妇的风格。您可以使用选择器或方法。下面是一个使用选择器的例子：

$("#container :not(select)");

This will match any child within #containerthat is nota <select>element. Then we have the method fashion of exclusion, which goes by the same name, but must be ran differently:

这将匹配任何孩子中#container是不是一个<select>元素。然后我们有排除的方法方式，它具有相同的名称，但必须以不同的方式运行：

$("#container").children().not("select");

This runs against the childrenof the matched elements. In this case, .notacts as a filter. Which brings me to the next example, using .filter()to get the results you want. With this method, we can provide our own custom function to rummage through the results and pick the ones we want:

这针对children匹配元素的 。在这种情况下，.not充当过滤器。这让我进入下一个示例，.filter()用于获得您想要的结果。使用这种方法，我们可以提供我们自己的自定义函数来翻阅结果并选择我们想要的结果：

Using .filter()to filter the matched elements » Live Demo

使用.filter()过滤匹配的元素»现场演示

$( "#container" ).children().filter( isNotSELECT ).fadeTo( "slow", .5 );???????????????????????????

function isNotSELECT () {
    // Returns TRUE if element is NOT select
    return !$(this).is("select");
}

In this example, we select all of the children of #container, and then pass them through a filter that we have defined called "isNotSelect". Within our filter, we return either trueor falsefor every element. If we return true, that element will be returned to the result set. If we return false, that element will be removed from the result set. We're asking if the element is nota select. This will return falsefor all select elements, thus removing them from our collection.

在此示例中，我们选择 的所有子项#container，然后将它们传递给我们定义的名为“isNotSelect”的过滤器。在我们的过滤器中，我们为每个元素返回一个true或false一个。如果我们 return true，该元素将返回到结果集。如果我们 return false，该元素将从结果集中删除。我们询问元素是否不是选择。这将返回false所有选择元素，从而将它们从我们的集合中删除。

回答by Jeff

You can also try it using traversing methods:

您也可以使用遍历方法进行尝试：

$('#container').children().not('#selectorId');

or being a final option:

或作为最终选择：

$('#container').children().filter(function(){
    return $(this).attr('id') !== 'selectorId';
}

回答by Mike Kormendy

$(#container select).siblings()

http://docs.jquery.com/Traversing/siblings

http://docs.jquery.com/Traversing/siblings

回答by adardesign

maybe this can help you where 3 is the #select

也许这可以帮助您，其中 3 是 #select

try one of these:

尝试其中之一：

$("#container *:not(eq(3))");
$("#container").children().filter(:not(eq(3)));

回答by redsquare

It is not clear what you actually want from your question. :not(select) will filter out the select from all the descendants but it will not out the select descendants. If this is your issue then try the following

目前还不清楚你真正想要从你的问题中得到什么。:not(select) 将从所有后代中过滤掉选择，但不会过滤掉选择后代。如果这是您的问题，请尝试以下操作

Demo

演示

$("#container *").filter( function(){ 
    return $(this).closest('select').length === 0 
})

回答by Dirk

JQuery click handler for everything but a certain object
Two approaches to the problem: The one with 8 votesis probably the one you are looking for.

除了某个对象之外的所有对象的 JQuery 单击处理程序
解决问题的两种方法： 获得8 票的可能就是您正在寻找的。