blocks|key|2972090|text|您可以使用逗号组合多个选择器：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2972091|$('#Create+.myClass,#Edit+.myClass').plugin({options+here});|code-block|syntax|javascript|2972092|或者，如果您要拥有大量表单元素，则可以向所有表单元素添加一个类，然后在该类中进行搜索。这不会给你带来所谓的限制搜索的速度节省，但如果我是你，我真的不会太担心这一点。浏览器在背后做了很多奇妙的事情来优化常见的操作--简单的类选择器可能更快。|2972093|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

You can combine multiple selectors with a comma:

<pre><code>$('#Create .myClass,#Edit .myClass').plugin({options here});
</code></pre>

Or if you're going to have a bunch of them, you could add a class to all your form elements and then search within that class. This doesn't get you the supposed speed savings of restricting the search, but I honestly wouldn't worry too much about that if I were you. Browsers do a lot of fancy things to optimize common operations behind your back -- the simple class selector might be faster.

blocks|key|274944|text|$("#Create").find(".myClass").add("#Edit+.myClass").plugin({});|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|274945|使用$.fn.add连接两个集合。|274946|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/add/^0|0|1R|0|2|8|2|8|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@$9|Q|A|R|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|S|8|@$9|T|A|U|B|C]]|D|@$9|V|A|W|1|X]]|E|$]]|$1|H|3|-4|5|6|7|Y|8|@]|D|@]|E|$]]]|I|$J|$5|K|L|M|E|$N|O]]]]

<code>$("#Create").find(".myClass").add("#Edit .myClass").plugin({});</code>

Use <a href="http://api.jquery.com/add/" rel="noreferrer"><code>$.fn.add</code></a> to concatenate two sets.

blocks|key|3185899|text|您应该能够使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3185900|$('#Edit.myClass,+#Create.myClass').plugin({options+here});|code-block|syntax|javascript|3185901|jQuery+%7C+Multiple+Selectors|offset|length|3185902|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/multiple-selector/^0|0|0|0|R|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

You should be able to use:

<pre><code>$('#Edit.myClass, #Create.myClass').plugin({options here});
</code></pre>

<a href="http://api.jquery.com/multiple-selector/">jQuery | Multiple Selectors</a>

blocks|key|3185907|text|我认为通过这样做你可能会看到稍微好一点的性能：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3185908|$("#Create,+#Edit").find(".myClass").plugin(){
++++//+Options
});|code-block|syntax|javascript|3185909|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

I think you might see slightly better performance by doing it this way:

<pre><code>$("#Create, #Edit").find(".myClass").plugin(){
 // Options
});
</code></pre>

blocks|key|269414|text|像这样：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|269415|$('#Create+.myClass,+#Edit+.myClass').plugin({+
++++options:+here
});|code-block|syntax|javascript|269416|269417|您可以指定任意数量的选择器以合并到单个结果中。这种多表达式组合器是选择不同元素的有效方法。返回的jQuery对象中的DOM元素的顺序可能不同，因为它们将按文档顺序排列。此组合器的另一个替代方法是.add()方法。|blockquote|269418|269419|269420|269421|unordered-list-item|269422|269423|269424|entityMap^0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|U|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|V|8|@]|9|@]|A|$]]|$1|H|3|I|5|J|7|W|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|X|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]|$1|N|3|-4|5|O|7|10|8|@]|9|@]|A|$]]|$1|P|3|-4|5|O|7|11|8|@]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|12|8|@]|9|@]|A|$]]|$1|R|3|-4|5|6|7|13|8|@]|9|@]|A|$]]]|S|$]]

like:

<pre><code>$('#Create .myClass, #Edit .myClass').plugin({ 
 options: here
});
</code></pre>

<blockquote>
 You can specify any number of
 selectors to combine into a single
 result. This multiple expression
 combinator is an efficient way to
 select disparate elements. The order
 of the DOM elements in the returned
 jQuery object may not be identical, as
 they will be in document order. An
 alternative to this combinator is the
 .add() method.
</blockquote>

<ul>
<li><a href="http://api.jquery.com/multiple-selector/" rel="noreferrer">Multiple Selector</a></li>
<li><a href="http://api.jquery.com/add" rel="noreferrer">Add method</a></li>
</ul>

blocks|key|2972182|text|这里已经有了非常好的答案，但在其他一些情况下(不是特别的)，使用map可能是“唯一”的解决方案。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2972183|特别是当我们想要使用正则表达式而不是标准的正则表达式时。|2972184|在这种情况下，它将如下所示：|2972185|+$('.myClass').filter(function(index,+elem)+{
++++var+jElem+=+$(elem);

++++return+jElem.closest('#Create').length+>+0+%7C%7C+
+++++++++++jElem.closest('#Edit').length+>+0;

}).plugin(...);|code-block|syntax|javascript|2972186|正如我之前所说的，在这里，这个解决方案可能没有用，但是对于进一步的问题，是一个非常好的选择|2972187|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|Q|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|R|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

There are already very good answers here, but in some other cases (not this in particular) using map could be the "only" solution. 

Specially when we want to use regexps, other than the standard ones.

For this case it would look like this:

<pre><code> $('.myClass').filter(function(index, elem) {
 var jElem = $(elem);

 return jElem.closest('#Create').length &gt; 0 || 
 jElem.closest('#Edit').length &gt; 0;

}).plugin(...);
</code></pre>

As I said before, here this solution could be useless, but for further problems, is a very good option

blocks|key|269457|text|如果我们想要将相同的功能和特性应用于多个选择器，那么我们可以使用多个选择器选项。我想我们可以说这个特性像可重用性一样被使用。编写一个jquery函数，然后添加多个选择器，在这些选择器中我们需要相同的特性。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|269458|请看下面的例子：|269459|​|269460|$(+"div,+span,+.paragraph,+#paraId"+).css(+{"font-family":+"tahoma",+"background":+"red"}+);|code-block|syntax|javascript|269461|<script+src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>Div+element</div>
<p+class="paragraph">Paragraph+with+class+selector
<p+id="paraId">Paragraph+with+id+selector
Span+element|269462|269463|我希望它能对你有所帮助。加名|269464|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|S|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|T|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|U|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|H|7|V|8|@]|9|@]|A|$I|J]]|$1|M|3|E|5|6|7|W|8|@]|9|@]|A|$]]|$1|N|3|O|5|6|7|X|8|@]|9|@]|A|$]]|$1|P|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|Q|$]]

If we want to apply the same functionality and features to more than one selectors then we use multiple selector options.
I think we can say this feature is used like reusability. write a jquery function and just add multiple selectors in which we want the same features.

Kindly take a look in below example:

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$( "div, span, .paragraph, #paraId" ).css( {"font-family": "tahoma", "background": "red"} );</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;div&gt;Div element&lt;/div&gt;
&lt;p class="paragraph"&gt;Paragraph with class selector&lt;/p&gt;
&lt;p id="paraId"&gt;Paragraph with id selector&lt;/p&gt;
&lt;span&gt;Span element&lt;/span&gt;</code></pre>
</div>
</div>


I hope it will help you.
Namaste

Normally when I use a class as a selector I try to use an "id" selector with it so it does not search through the entire page but only an area where the class would be.

However I have a partial view with code in it. This partial view (common code) gets wrapped around a form tag.

I have:

<pre><code>&lt;form id="Create"&gt;
// load common code in from partial view
&lt;/form&gt;

&lt;form id="Edit"&gt;
// load common code in from partial view
&lt;/form&gt;
</code></pre>

Now in this common code I need to attach a plugin to multiple fields so I would do

<pre><code>$('#Create .myClass').plugin({ options here});

$('#Edit .myClass').plugin({options here});
</code></pre>

So it's pretty much the same code. I am wondering if there is a way to make it look for either of the id's?

Edit

I am having problems with it when I have variables for my selectors

<pre><code> my.selectors = 
 {
 A: '#Create',
 B: '#Edit',
 Plugin: ' .Plugin' 
 };

 $(selector.A+ selectors.Plugin, selector.B+ selectors.Plugin)
</code></pre>

Does not seem to run.

Multiple selector chaining in jQuery?

jQuery

通常，当我使用一个类作为选择器时，我会尝试对它使用一个"id“选择器，这样它就不会搜索整个页面，而只搜索类所在的区域。然而，我有一个包含代码的局部视图。这个局部视图(公共代码)被包装在一个表单标记周围。我有：<form id="Create">// load common code in from partial view</form><form id="Edit">// load common

问jQuery中的多选择器链接？
EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery中的多选择器链接？EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery中的多选择器链接？
EN