Ankündigung

Einklappen
Keine Ankündigung bisher.

[Erledigt] jQuery's ON keine Funktion

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • oelgemeyer
    hat ein Thema erstellt [Erledigt] jQuery's ON keine Funktion.

    [Erledigt] jQuery's ON keine Funktion

    Hey Leute,

    ich habe mal wieder ein Problem mit jQuery. Und zwar wird eine Seite mit einer Tabelle dynamisch geladen und in dieser Tabelle ist in einer Spalte ein span element. Ich will das span anklicken können und habe es so wie sonst auch, so gemacht:

    Code:
    $("div#content #articles tr td").on("click", "span", function() {
        console.log("hey");
    });
    Es will aber einfach nicht feuern. Wieso nicht? Dafür ist "on" doch da? Und vor allem hat es sonst auch funktioniert. Wenn ich den code direkt in die dynamisch geladenene seite schreibe funktioniert es auch aber so möchte ich es nicht machen.

    Irgendwelche Ideen?

  • oelgemeyer
    antwortet
    Ich weiß das es zwei unterschiedliche Dinge sind. Das habe ich bereits gesagt. Und schön das ich dämlich bin, danke dafür. Der letzte Teil nach dem dämlich hätte gereicht. Trotzdem danke.

    Einen Kommentar schreiben:


  • nikosch
    antwortet
    Mag sein aber mit beiden kann ich Dinge behandeln die dynamisch geladen werden.
    Das eine ist ein Klick, das andere ein DOM-Change. Nur weil ein Fahrrad auf der Strasse fährt, ist es noch kein Auto.

    Mir gefällt die Version mit DOMSu.. ganz gut weil ich das einfach um alle meine Funktionen die Objekte behandeln die in der Zukunft geladen werden schreiben kann.
    Das ist einfach nur dämlich, weil Du damit jedesmal neue Eventhandler schaffst. Vielleicht sogar dopelte auf einem DOM-Node, der sich gar nicht geändert hat.

    Event Delegation erzeugt dagegen ein (1!) einziges Event. „Aufwand“ entsteht erst, wenn das Event gefeuert wird.

    Einen Kommentar schreiben:


  • oelgemeyer
    antwortet
    Mag sein aber mit beiden kann ich Dinge behandeln die dynamisch geladen werden. In meinem Fall entweder
    $("#content").on("click", "table#articles span", function() { });

    oder

    $("#content").on("DOMSubtreeModified", function() {});

    beides funktioniert. Mir gefällt die Version mit DOMSu.. ganz gut weil ich das einfach um alle meine Funktionen die Objekte behandeln die in der Zukunft geladen werden schreiben kann.

    Die Frage ist nur, weil ich das mal irgendwo gelesen habe, ob DOMSu.. zu performencelastig ist?
    Vielleicht ist es auch einfach nicht richtig, laut irgendwelchen Regeln oder ähnliches. Dann würde ich natürlich lieber die "richtige" Variante nutzen.

    Einen Kommentar schreiben:


  • nikosch
    antwortet
    Das ist was ganz anderes.

    Einen Kommentar schreiben:


  • oelgemeyer
    antwortet
    Achso ich wollte noch fragen:
    Ist diese Version mit on click schneller als mit on DOMSubtreeModified?

    Einen Kommentar schreiben:


  • oelgemeyer
    antwortet
    Vielen Dank für eure Antworten. Ich hatte das so ausführlich geschrieben also die Verschachtelung weil ich dachte das es vielleicht sonst nicht gefunden wird.

    Vielen Dank an tklausl! Jetzt weiß ich das auch endlich mal! Es funktioniert jetzt. Es ist ja auch irgendwie logisch. ^^ Vielen Dank!

    Einen Kommentar schreiben:


  • nikosch
    antwortet
    Es ist aussderdem nicht nötig, jede einzelne Verschachtelungsstufe aufzuzählen. span können ja nur in td/th stehen.

    Einen Kommentar schreiben:


  • tkausl
    antwortet
    Zitat von oelgemeyer Beitrag anzeigen
    Und zwar wird eine Seite mit einer Tabelle dynamisch geladen
    Alles was noch nicht existiert und erst später dynamisch dazu kommt darf nicht im $() stehen sondern im on() als zweiter Parameter.

    Einen Kommentar schreiben:


  • monolith
    antwortet
    Lass dir in der Console mal anzeigen:
    Code:
    $("div#content #articles tr td span")
    Vielleicht wird das span nicht gefunden?

    Übrigens sollte $("div#content #articles tr td span") die gleichen Elemente finden wie $("#articles td span").
    Warum?
    - IDs sollen einzigartig sein, d. h. es gibt darf nur ein Element mit der ID 'articles' geben - man muss also vorher gar nicht filtern
    - ein td ist immer in einem tr

    => $("#articles td").on("click", "span",...

    Einen Kommentar schreiben:

Lädt...
X