wie zu verwenden jquery get wählen Element hat MULTIPLE-Modus und umgekehrt

Question

Ich habe einen Stapel mit meiner Arbeit heute. Mein Stack hier:

Ich habe ein select HTML-Element und es hat mehrere Modus:

<select class="test" MULTIPLE></select> 

(MEHRERE Modus auch als Typ: multiple = "multiple" i hier inclue)

<select class="test" multiple='multiple'></select> 

jetzt will ich nur dieses Element in vielen normalen Auswahlelement auswählen:

<select class="test" ></select> 
<select class="test" ></select> 
<select class="test" multiple='multiple'></select> 
<select class="test"> </select> 

Ich benutzte jQ wie folgt:

$(".test[!MULTIPLE]").css('border','solid 1px red'); 

aber alle wählen Element hat Grenze rot;

Wie kann ich nur wählen Element MULTIPLE. Und wählen Sie nicht MULTIPLE-Modus?

Answer 1

Try this:

$(".test:not([multiple])").css('border','solid 1px red'); 

Edit: Wie Reigel erwähnt, können Sie das gleiche Ergebnis mit einer besseren Leistung eingestellt, wenn Sie die Pseudo-Selektor jQuery vermeiden:

$(".test").not([multiple]).css('border','solid 1px red'); 

bearbeiten 2: Wie Sie an den Kommentaren sehen können, zeigen einige schnelle Tests, dass zumindest für einige von uns die zweite Option tatsächlich langsamer ist. Weiter nach, css3.info, native Unterstützung für die :not CSS3 Selector ist weiter verbreitet als ich dachte. Das macht wahrscheinlich den ganzen Unterschied (sorry IE7), vorausgesetzt, dass jQuery den nativen Selektor verwendet, wenn verfügbar.

Edit 3: Weiter dank @nickf, wer diese Tests in IE8 ausgeführt, und keinen wesentlichen Unterschied zwischen den beiden gefunden. Angesichts all dieser Unklarheiten wäre es ratsam, in Ihrem Zielbrowser zu testen, ob jQuery-Pseudo-Selektoren oder :not/ speziell in einen Code-Hotspot fallen, der einen wesentlichen Einfluss auf die Leistung hat (und wenn Sie ein kontrolliertes Ziel haben) Browserumgebung).

Aber wenn Ihr Ziel alle Browser ist, sieht es so aus, als ob der beste Rat ist, das zu verwenden, was am besten zu Ihrem Code passt, und eine vorzeitige Optimierung zu vermeiden.

Answer 2

$('.test').not('[multiple]').css('border','solid 1px red'); 

aber wenn Sie IE 7 verwenden und unten, Grenzen in ausgewählten Elemente nicht wie erwartet ändern ..

Answer 3

Eine andere Möglichkeit, es über die Seite Generika zu halten, ohne die Klasse beschränkt zu sein ist auf diese Weise -

$("select[multiple='multiple']").each(function() { 
    $('#'+this.id+' option:selected').prependTo(this); 
}); 

JSFiddle link