it-swarm.com.de

Wie kann ich eine gespeicherte und mit Schnappschuss versehene Jquery-Auswahlvariable aktualisieren?

Ich bin gestern in einem Problem mit einem Jquery-Selector gelaufen, den ich einer Variablen zugewiesen habe, und das macht mich verrückt.

Hier ist ein jsfiddle mit testcase:

  • ordne das .elem meinem obj var zu
  • protokollieren Sie beide Längen an der Konsole. Ergebnis => 4
  • Entfernen Sie # 3 aus dem DOM
  • log obj an der Konsole => die entfernte # 3 ist immer noch da und die Länge ist immer noch 4. Ich habe herausgefunden, dass die Jquery-Abfrage ein Snapshot ist? auf die Variable und kann nicht? bleibe auf dem Laufenden
  • log .elem auf der Konsole. yep Ergebnis => 3 und die # 3 ist weg
  • Jetzt aktualisiere ich .elem mit einer neuen Breite von 300
  • logging obj & obj.width gibt mir 300 .. Also wurde der Snapshot aktualisiert? Interessant ist, dass 3 der 4 Divs die neue Breite haben, aber die entfernte # 3 nicht ...

Ein weiterer Test: Hinzufügen eines li-Elements zum domtree und zum Protokollieren von obj und .elem. . elem hat das neue li und obj nicht, weil es immer noch der alte Schnappschuss ist 

http://jsfiddle.net/CBDUK/1/

Gibt es keine Möglichkeit, dieses Objekt mit dem neuen Inhalt zu aktualisieren? Ich möchte kein neues Objekt erstellen, da in meiner Anwendung viele Informationen in diesem Objekt gespeichert sind. Ich möchte nicht zerstören ...

29
Ralk

Ja, es ist eine Momentaufnahme. Beim Entfernen eines Elements aus der Seiten-DOM-Struktur werden nicht alle Verweise auf das Element entfernt.

Sie können es so aktualisieren:

var a = $(".elem");

a = $(a.selector);

Mini-Plugin:

$.fn.refresh = function() {
    return $(this.selector);
};

var a = $(".elem");

a = a.refresh();

Diese einfache Lösung funktioniert jedoch nicht mit komplexen Traversen. Sie müssen einen Parser für die .selector-Eigenschaft erstellen, um die Momentaufnahme für diese zu aktualisieren.

Das Format ist wie folgt:

$("body").find("div").next(".sibling").prevAll().siblings().selector
//"body div.next(.sibling).prevAll().siblings()"

In-Place Mini-Plugin:

$.fn.refresh = function() {
    var elems = $(this.selector);
    this.splice(0, this.length);
    this.Push.apply( this, elems );
    return this;
};

var a = $(".elem");
a.refresh() //No assignment necessary
57
Esailija

Ich mochte auch die @Esailija-Lösung, aber anscheinend hat this.selector einige Fehler mit dem Filter. Also habe ich mich an meine Bedürfnisse angepasst, vielleicht ist es für jemanden nützlich

Dies war für jQuery 1.7.2. Es wurde keine Aktualisierung der gefilterten Momentaufnahmen bei höheren Versionen durchgeführt

$.fn.refresh = function() { // refresh seletor
    var m = this.selector.match(/\.filter\([.\S+\d?(\,\s2)]*\)/); // catch filter string
    var elems = null;
    if (m != null) { // if no filter, then do the evarage workflow
        var filter = m[0].match(/\([.\S+\d?(\,\s2)]*\)/)[0].replace(/[\(\)']+/g,'');
        this.selector = this.selector.replace(m[0],''); // remove filter from selector
        elems = $(this.selector).filter(filter); // enable filter for it
    } else {
        elems = $(this.selector);
    }
    this.splice(0, this.length);
    this.Push.apply( this, elems );
    return this;
};

Code ist nicht so schön, aber er hat für meine gefilterten Selektoren funktioniert.

1
Roman M. Koss

Wenn Sie remove() verwenden, wird nur ein Teil des DOMs, aber nicht alle untergeordneten oder verwandten Elemente entfernt. Wenn Sie jedoch empty() für das Element verwenden, ist das Problem nicht mehr vorhanden.

Z.B.:

 $('#parent .child).find('#foo').empty();

Vielleicht kann es jemandem nützlich sein!

Jquery .selector ist veraltet. Es ist besser, die Zeichenfolge mit dem Selektorwert an eine Variable zu erinnern, wenn Sie diese zuweisen

function someModule($selector, selectorText) {
   var $moduleSelector = $selector;
   var moduleSelectorText = selectorText;

   var onSelectorRefresh = function() {
      $moduleSelector = $(moduleSelectorText);
   }
}

https://api.jquery.com/selector/

0
Kattie