Frage

Was ist die Best-Practice-Art und Weise auf Seite dynamisch erzeugte Element identifizieren?

Lassen Sie mich erklären. Ich habe eine Liste von Elementen, kann es so wenig oder so viele Elemente, wie der Benutzer definiert, auf einer Seite. Jede dieser entspricht ein Element jeder mit seinem eigenen ID. Nun hat der Benutzer die Möglichkeit, bearbeiten oder löschen sind diese Elemente auf der Seite und diese Operationen mit jQuery behandelt. Jedes Element wird mit einem Link pro Betrieb sie können Aktion (d löschen und bearbeiten).

Jetzt ein Problem ist, zu wissen , die Element der Benutzer ausgewählt hat. damit umgehen ich jeweils die ID des Elements als ein ID-Attribut verknüpfen geben, die ich erhalten mit jQuery dann:

 <a href="#" class="delete" id="<%= Model.elementID%>">Delete</a>

  $(".delete").live("click", function(event) {
      event.preventDefault();
      var elementID =  $(this).attr("id");
      //other code
   });

Das ist natürlich bei weitem nicht ideal, da es viele DOM-Elemente bedeuten würde, könnte die gleiche ID haben. Alternativ könnte ich mein eigenes Attribut wie elementID schaffen, aber ich glaube, diese Standards bricht.

Also, was könnte man empfehlen. Wie kann ich auf einer Seite dynamisch generierten Elemente identifizieren?

War es hilfreich?

Lösung

Ich habe diese ziemlich viel getan für meine Websites und meine Lösung ist eine Kombination aus, wo Sie angefangen von und einige der Kommentare:

eine Namenskonvention verwenden, wie "ELEMENT_TYPE: id: action". So erzeugt Ihr Beispiel ist sein „Element: 23: löschen“. Dann können Sie split () die .attr ( „id“), die Sie ergriffen haben und bestimmen, was es ist ( „Bericht“ vs „Ordner“), die ID, und was Sie ( „Löschen“ tun wollen, „bearbeiten “, "move").

Das ist für mich sehr gut funktioniert, und ist sehr skalierbar.

ich die Klasse halten würde, obwohl, so dass Sie leicht Ereignisse über jquery anhängen können.

James

Andere Tipps

Warum nicht einfach eine Klasse hinzufügen, statt. Dies löst auch das Problem von mehreren IDs, die als nicht erlaubt entzog sich zu und wird wichtige Themen mit anschließender jquery Operationen führen.

<a href="#" class="delete" id="<%= Model.elementID%>">Delete</a>

  $(".delete").live("click", function(event) {
      event.preventDefault();
      //other code
      $(yourNewElement).addClass('noob');

   });

Eine andere Sache, die Sie tun können, ist dies:

<a href="#<%= Model.elementID%>" class="delete"> Delete </a>
$(".delete").live("click", function(event) {
    event.preventDefault();
    var elementID =  $(this).attr("href");
    // strip the preceding '#'

    // rest of your code
});

PS: alles hat keine Best Practice. Manche Dinge brauchen nur einen neuen appoach.

Cheers, JRH

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top