Tut doppelten id ' s screw up jquery-Selektoren?

Hätte ich zwei divs, die beide mit der id="myDiv"

Würde $("#myDiv").fadeOut(); fade beide divs aus? Oder würde es verblassen, nur der erste/zweite? Oder gar keinen?

Wie kann ich das ändern das man es ausgeblendet?

Hinweis: weiß ich doppelte id ' s ist gegen standards, aber ich bin mit dem fancybox -, modal-popup und es Duplikate angegebenen Inhalt auf der eigenen Seite für den Inhalt der popup-Fenster. Wenn jemand eine Möglichkeit kennt, um dieses (vielleicht bin ich mit fancybox falsch) lassen Sie es mich bitte wissen.

  • Haben Sie es ausprobiert?
  • Ja, aber ich hatte gehofft, wenn ich fragte jemand anderes, die Sie vielleicht in der Lage sein, geben Sie mir eine Erklärung, warum nur der erste bekommt ausgeblendet.
  • Tut es doppelt? oder "verschieben" Sie den Inhalt in Ihr popups position?
  • es dupliziert es. wenn ich mir den source-code mit Firebug kann ich sehen, den code doppelt drin. Einmal wo ich es abgelegt, und einmal in der fancybox
InformationsquelleAutor Matt | 2009-06-27
  1. 6

    jQuery entspricht genau einem element, wenn die Abfrage eine ID. Ein array von höchstens einer Element Objekt wird zurückgegeben $("#foo").get(). Finden Sie die jQuery-Dokumentation für mehr Informationen, oder versuchen Sie es selbst.

    $(function() {
    alert($("#foo").length);
});
    • $("#foo") nicht zurückgegeben wird, ein array. Es gibt ein Objekt mit mehreren Funktionen. $("#foo").get() ist ein array.
    • in der Tat können Sie index-das jquery-Objekt e.g $('.foo')[0]. Ist es ein array ist 😉
    • Als redsquare sagte, Sie können Elemente mit Indizes, und jQuery bietet auch ein "length" - Eigenschaft. In diesem Sinne können Sie behandeln es wie ein array. Aber auch die anderen array-Funktion (wie pop -, join, etc.) sind nicht vorgesehen. Ich aktualisiert meine Antwort zu enthalten die get-Funktion, wie Matthew hingewiesen.
    InformationsquelleAutor William Brendel
  2. 11

    Element-IDs sollen eindeutig sein. Das Vorhandensein mehrerer DIVs der gleichen ID wäre falsch und unberechenbar, und trotzt der Zweck der ID. Wenn Sie dies getan haben:

    $('.myDiv').fadeOut();

    Dass verblassen würde beide von Ihnen aus, wenn Sie die geben Sie eine Klasse von myDiv und eindeutigen IDs (oder gar keine).

    InformationsquelleAutor karim79
  3. 7

    "Anmerkung: ich weiß, doppelte id 's ist gegen standards"

    Dann tun Sie es nicht. Sie haben bereits herausgefunden, zwei Probleme. Es verstößt gegen Normen, und es stört mit jQuery (und in der Tat die regelmäßige DOM) Auswahl-Mechanismus. Es wird wahrscheinlich mehr Probleme in der Zukunft.

    Durchaus möglich, Sie sind Verwendung von fancybox falsch ist, in dem Fall hoffe ich, dass jemand vertrautes mit, es hilft Ihnen. Oder schlimmer noch, wenn das Skript selbst ist fehlerhaft, sollten Sie nicht verwenden es.

    • also ich soll das schreiben meiner eigenen modalen popup dann? Ich weiß, ich bin nicht die einzige, die fancybox verwendet. Das hat Sie nicht wirklich beantworten meine Frage an alle...
    • Ich habe nie vorgeschlagen, Sie schreiben Ihre eigenen modalen dialog.
    InformationsquelleAutor Matthew Flaschen
  4. 1

    Da $('#myDiv') wird nur das erste div mit der ID, Sie werden haben zu finden, alle Elemente mit dieser ID mit diesem trick:

    $('[id=myDiv]');

    So, für Ihren Fall gelten die fadeOut, um alle diese divs:

    $('[id=myDiv]').fadeOut();

    Und wenn Sie sicherstellen möchten, dass Ihre Seite nicht über diese ID doppelt, dann können Sie entfernen Sie die überzähligen dadurch:

    $('[id=myDiv]:gt(0)').remove();
    • Ich denke, dass alle damit einverstanden, dass doppelte ids ist eines der schlimmsten Dinge, die man tun kann (tut weh, kleines Kätzchen & make sad pandas). Obwohl, dieser trick half mir fix einen kleinen Fehler in ein kleines Dienstprogramm, Web-app, die ich geschrieben habe. In der Tat, ich versteckte Tabellen, die als Vorlagen dienen (ich kopiere Sie, neue zu bilden) und diese Vorlagen enthalten Ids, weil ich dann diese ids für die übersetzung auf der client-Seite (ja, ich bin ein bisschen Spaß mit JavaScript hier ^^)
    InformationsquelleAutor Head
  5. 1

    Können Sie auch die route von mit finden(). finden Sie zurückkehren wird, alle Elemente mit dieser ID, und begrenzen Sie den Umfang auf einen bestimmten Elternteil, wenn nötig, versuchen Sie so etwas wie $(document).find('#myDiv').fadeOut();

    oder 

    $('.parentElement').find('#myDiv').fadeOut();
    InformationsquelleAutor Steve Ottenad
  6. 0

    Ich lief in das gleiche problem. Offenbar, wenn Sie Inhalte erstellen, die auf die Seite aus die Sie öffnen möchten, eine Fancybox, es schafft einen Spiegel, div des ursprünglichen Inhalts. In meinem Beispiel, waren die Kontrollen, eingewickelt in ein div, dass die fancybox erstellt mit dem Namen "fancy_div"

    War ich in der Lage, wählen Sie das Steuerelement aus und erhalten Sie den Wert, indem Sie das folgende format für den Selektor:

    $('#fancy_div [id=InputText]').val();

    Steuerelemente möglicherweise existieren anderswo innerhalb der Fancybox. das beste, was zu tun ist, Blick auf die viewsource, aber es ist schwierig.

    Man die Quelle anzeigen, verwenden Sie die folgende Technik:
    Platzieren Sie das tag auf Ihrer form:
    Bekommen Wert
    Öffnen Sie das Formular, klicken Sie auf das tag, um öffnen Sie den alert-Fenster.

    Stellen Sie sicher, dass sich Ihr cursor innerhalb der Seite, Inhalt (finden Sie Strg und klicken).

    Rechts klicken aus der Steuerung, und wählen Sie "Quelltext anzeigen".

    Ein Haufen divs vorhanden sind, so suchen Sie das div mit dem Inhalt.

    Hoffe, das hilft.

    InformationsquelleAutor
  7. 0

    Ich hatte vor kurzem ein ähnliches problem. Ich hatte eine einzige Seite, die angezeigt verschiedene Inhalte über Ajax laden. Es gibt einen Knopf, löst der server zum generieren einer PDF-Bild.

    Meine ursprüngliche Lösung war die Verwendung einer class-Selektor, der gut funktioniert hat, aber verursacht Reibung mit einem anderen Entwickler. Es waren so viele Klassen, die bereits in den links, die Verwendung einer Klasse als ein Bezeichner aus der code hässlich. So habe ich ein name-Attribut:

    <a name="printButton"....

$('a[name="printButton"]').on('click',function(){....

    War genau der Punkt!

    InformationsquelleAutor Steve Gelman
Schreibe einen Kommentar