Mit DOMSubtreeModified mutation Veranstaltung. in jQuery

Ich habe die folgende jQuery-code auf meiner Seite und alles funktioniert gut in chrome.Aber wenn ich öffnen Sie die jeweilige Seite in firefox bekomme ich die nicht mehr Reagiert Script-Fehler.

Ich weiß, wie pro DOM3-Spezifikation, die die mutation events sind veraltet. Aber immer Noch, wenn jemand helfen könnte mich hier, ich werde verpflichtet werden.

jQuery('#term').on("DOMSubtreeModified",function(){
$("#term > .click-slide").click(function(){
            $(this).siblings().slideToggle();

            });
 });

Jeweiligen HTML-ist:

<div class="btn-slide" id="term">
    <div class="click-slide">
      <button>Search Terms </button>
    </div>
    <div class="btn-box">
       <label><span>Novena</span></label>
    </div>
</div>

InformationsquelleAutor jGupta | 2014-08-01

  1. 14

    Sieht es aus wie im Firefox, wird der Anruf zu .slideToggle() ist die Auslösung der DOMSubtreeModified Ereignis, während dies nicht passiert ist in Chrom. Also im Grunde in Firefox, etwas zunächst löst das Ereignis, das bindet Ihre click-handler. Alles ist gut an dieser Stelle. Wenn Sie gehen dann zu klicken, die slideToggle passiert, wie erwartet. Jedoch, feuert aus der DOMSubtreeModified Ereignis und Sie dann am Ende mit zwei click-event-Handler sowohl tun slideToggle denn Sie waren nun doppelt angemeldet. Das nächste mal, wenn Sie klicken Sie auf ist, wenn die endlos-Schleife passiert. Grundsätzlich sind die mehreren Klick-Ereignisse halten die Auslösung DOMSubtreeModified registriert click-Handler, die macht mehr slideToggles geschehen auslöst, mehr DOMSubtreeModifieds, und so weiter und so Fort. Um dies zu beheben, können Sie die jQuery - .one erzählt, die Ihre Seite nur mit Feuer aus, dass DOMSubtreeModified handler einmal, die verhindert, dass diese Schleife. Wenn das nicht eine passende Lösung, die Sie brauchen nur zu kommen mit einigen anderen Weg, um sicherzustellen, dass die .click Handler nicht bekommen, gebunden, mehr als einmal.

    jQuery('#term').one("DOMSubtreeModified",function(){   //Notice this is using .one and not .on

    Schauen Sie sich dieses JSFiddle - es ist mit .one aber ich war in der Lage zu überprüfen, ob bei der Verwendung .auf, das problem passiert bei Firefox und nicht Chrome.

    Das ist wirklich gut erklärt. Ich bemerkte, was passiert, wenn Sie mit ".auf" im Ort ".ein" in-die Geige. Danke.
    wow... du meine Frage beantwortet und eine Frage ich hatte vor einer Weile. Ich hatte nie gehört, dass die .one Funktion

    InformationsquelleAutor p e p

  2. 14

    Gut, das ist vielleicht nicht eine passende Antwort hier, denn die Frage war über Mutation-events, und die eine unten geschrieben ist mit Mutation-Observers aber noch bin ich Entsendung es, wie einige finden dies nützlich.

    Dies ist die alternative, die ich für DOMSubtreeModified Ereignis falls einige Knoten Hinzugefügt, in der DOM.

    var target = $( "#term" )[0];
//Create an observer instance
var observer = new MutationObserver(function( mutations ) {
   mutations.forEach(function( mutation ) {
       var newNodes = mutation.addedNodes; //DOM NodeList
       if( newNodes !== null ) { //If there are new nodes added

        //alert('something has been changed');

      }
   });    
});

//Configuration of the observer:
var config = { 
    attributes: true, 
    childList: true, 
    characterData: true 
};

//Pass in the target node, as well as the observer options
observer.observe(target, config);
//Later, you can stop observing
//observer.disconnect();
    schön prägnant mutation observer-Beispiel. mit einigen jquery. danke!
    Ich danke Ihnen sehr für diese.

    InformationsquelleAutor jGupta

Schreibe einen Kommentar