Jquery hide() alle Elemente mit einer bestimmten Klasse außer einem

Lesezeit: 2 Minuten

Benutzer-Avatar
Lisovaccaro

<div class="hide">A</div>
<div class="hide">B</div>
<div class="hide" id='1'>C</div>

Ich habe eine Funktion namens showOne, die alle Elemente ausblenden und dann dasjenige mit id=’1′ anzeigen soll.

function showOne(id) {
// Hide all elements with class="hide"
$('#'+id).show();
}

Wie verstecke ich alle Elemente mit class=”hide” in jquery?

  • Nur eine Anmerkung – Sie können nicht haben id die mit einer Zahl beginnt, es sei denn, es handelt sich um HTML5

    – Bongs

    16. Mai 2012 um 5:14 Uhr


Versuchen Sie etwas wie:

function showOne(id) {
    $('.hide').not('#' + id).hide();
}

showOne(1);​

Demo: http://jsfiddle.net/aymansafadi/kReZn/

Ich stimme @TheSystemRestart jedoch zu: “HINWEIS: VERWENDEN SIE NICHT NUR NUMERISCHE ID”.

  • +1 – Die Verwendung von .not() ist eine bessere Lösung, da Sie jetzt das Element, das Sie anzeigen möchten, nicht ausblenden und dann anzeigen müssen. Das Vermeiden des “blinkenden” Effekts ist meiner Meinung nach ein besseres UI-Erlebnis.

    Benutzer1469742

    28. Dezember 2012 um 11:05 Uhr


  • Ich möchte mir nur eine Sekunde Zeit nehmen und anerkennen, wie schlecht das Beispiel für einen absoluten Neuling geschrieben ist, einfach weil Sie Ihre Klasse „hide“ als .hide()-Funktion benannt haben, was die Leute glauben lassen könnte, dass es eine Verbindung zwischen den beiden gibt . Ich sehe dieses Namensmuster überall und als ich lernte, war es eine Qual für mich, solche Beispiele durchzugehen.

    – Edeph

    24. März 2016 um 14:03 Uhr

Benutzer-Avatar
Der Systemneustart

$('div.hide').hide(300,function() {  // first hide all `.hide`
   $('#'+ id +'.hide').show(); // then show the element with id `#1`
});

HINWEIS: VERWENDEN SIE NICHT NUR NUMERISCHE ID. NICHT GESTATTET. LESEN SIE DIES

  • Numerische IDs sind in HTML5 erlaubt – kennen Sie einen aktuellen Browser, der sie nicht unterstützt?

    – nnnnn

    16. Mai 2012 um 5:28 Uhr

Benutzer-Avatar
Hitesh Modha

Sie müssen auf Elemente über den CSS-Klassennamen zugreifen. Verwenden Sie dazu . Operator

$('.hide').hide();

Es werden alle divs ausgeblendet.

Zeigen Sie jetzt ein Div nach ID;

$('#elemID').show();

Oder Sie können dies auch tun, indem Sie verwenden

$('.hide').eq(0).show();

Es zeigt die erste Div mit Klasse ausblenden.

Ich schäme mich fast dafür, wie einfach die Lösung war und dass ich sie gleich nach dem Schreiben der Frage gefunden habe. Gerade:

$('.hide').hide();

Benutzer-Avatar
HGK

Versuchen:

function showOne(id) { 
    $('.hide').hide();
    $('#'+id).show(); 
} 

Benutzer-Avatar
Ankur Verma

Sie können alle Komponenten mit der Klasse verbergen, indem Sie sie verwenden .
$(‘.verbergen’).verbergen();

1175270cookie-checkJquery hide() alle Elemente mit einer bestimmten Klasse außer einem

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy