Der jquery-Code funktioniert auf Konsole, aber nicht in Skript-Tags oder in angehängter js-Datei

Question

Dieses Snippet funktioniert in der Konsole aber weder in Skript-Tags noch in angehängten js-Datei.

Answer 1

warten Sie auf das DOM bereit sein, wenn Sie Ihre Event-Handler aufrufen:

jQuery(function($) { // this does the trick and also makes sure jQuery is not conflicting with another library 
    $(".filter-close").click(function(){ 
     $(this).parent().remove(); 
    }); 
}); 

^{wenn eine andere JavaScript-Bibliothek, wir $ .noConflict() aufrufen zu vermeiden Namespace Schwierigkeiten möchte. Wenn diese Funktion aufgerufen wird, ist die Verknüpfung $ nicht mehr verfügbar und zwingt uns jedes Mal jQuery zu schreiben, wenn wir normalerweise $ schreiben würden. jedoch bestand die Behandlungsroutine zum .ready() Methode kann ein Argument, das das globale jQuery Objekt übergeben wird. Dies bedeutet, dass wir das Objekt im Rahmen unserer .ready() -Prozedur umbenennen können, ohne anderen Code zu beeinflussen}

^{Documentation for .ready() method}

Answer 2

Vielleicht mit filter-close Klasse das Element existiert zum Zeitpunkt des diese Funktion im DOM nicht nennen. Ich nehme an, dass Sie Elemente dynamisch zu DOM hinzufügen. Bist du?

Answer 3

Es kann ein Problem der nicht vorhanden ist, in dem DOM sein, wenn die Event-Handler angebracht ist.

so etwas wie dieses Versuchen:

$(document).ready(function() { 
    // Handler for .ready() called. 

    $(".filter-close").click(function(){ 
     $(this).parent().remove(); 

    }); 

}); 

Die $ .ready() (Link unten) sorgt dafür, dass es versuchen tut, den Code rufen Sie den Handler hinzuzufügen, bevor die DOM gerendert wird, ähnlich wie OnLoad.

^{Documentation for JQuery .ready() method}

Es gibt auch potentielle Bibliothek Konflikte (siehe @ D4V1D Antwort zum Beispiel dafür), aber wir können nicht sicher sagen, ohne zu wissen, welche Fehlermeldung in der Konsole erscheinen (falls vorhanden) und im Idealfall mehr über den umgebenden Code.

Bitte drücken Sie F12 und sehen, was in der Konsole und/oder Netzwerkplatte gedruckt wird, oder google „browser dev-Konsole“, wenn F12 nichts tut.

Aber, wie gesagt, es in der Konsole funktioniert, so dass ich nehme an, Sie dev Konsole bedeuten und dass es in der Tat nur ein Timing-Problem, so unwahrscheinlich, dass ein Konflikt (wenn auch vielleicht noch Syntaxfehler irgendwo anders auf der Seite)