JS: FileInput Event feuert nicht in Wordpress?

  • Hallo liebe WPDE gemeinde!

    Leider bekomme ich einen bestimmten Teil meines JS Codes in Wordpress einfach nicht zu laufen!
    Ich versuche ein Change Event eines File Inputs zu nutzen um eine Dateiliste unter dem File Input aus zu geben. Leider bekomme ich keine Funktion an das Event gebunden sobald ich den Code in Wordpress ausführe.
    Führe ich den Code außerhalb von Wordpress aus, funktioniert alles - innerhalb von Wordpress nicht - und das Ohne Fehlermeldung o.ä.
    Um folgenden Code geht es:

    [INDENT]function start_filelist(){
    //setting global variables
    console.log("Init()");
    filelist = jQuery("#file-list");
    console.log(filelist);
    filecache = jQuery('#file-cache');
    console.log(filecache);
    fileInput = jQuery('#form-field-files');

    fileInput.on('change', function(){ console.log("Works"); });
    console.log(jQuery._data( fileInput, "events" ));

    }
    jQuery(document).ready(function($) {
    start_filelist();
    });
    [/INDENT]
    Ich bekomme in der Console die "filelist", "filecache" und "fileInput" Objekte korrekt angezeigt. Die zugeordnete Funktion wird aber nicht ausgeführt und die Abfrage der zum fileInput zugeordneten Events ergibt "undefined".

    Hat irgendjemand eine Ahnung woran das liegen könnte?

    Vielen Dank!

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Dann kann man nur dazu raten, professionelle Hilfe zu zahlen o_O

  • Mist, ich weiß einfach nicht warum der Code, der sonst überall funktioniert und eigentlich keine Probleme machen dürfte an dieser Stelle nicht funktioniert...
    Ich erstelle mal eine Testseite auf einer neuen Domain und versuche das Problem zu replizieren.

  • Unter folgender Adresse ist eine Testumgebung mit gleichen Plugins und Konfiguration zu finden:

    test.mierbach.com

    Der Upload befindet sich in einem Popup. Dafür einfach auf "Open Popup" klicken.

    Die Ausgabe findet über die Konsole Statt. Nach einem Upload sollte "Läuft" in der Console ausgegeben werden wenn das Script korrekt ausgeführt wird.

    Vielen Dank!

  • Deaktiviere alle CDN-, Cache-, Minify- und Optimierungs-Plugins, wie soll man so sinnvoll den Code ansehen können... o_O

    Ergänzung zum og. Code, versuche es ggf. mal mit einem delegated event handler, z.B.

    Code
    jQuery(document).on('change', '#form-field-files', function(){ console.log("change"); });

    Einmal editiert, zuletzt von b3317133 (4. Mai 2020 um 18:23)

  • Ok Leute. Ich habe den Cache deaktiviert und der Code wird korrekt ausgeführt. Hab das ganze überprüft - scheint ein Problem mit dem Minifizieren in WP-Rocket zu sein. Habe den Code aus dem Minifizierungsprozess ausgeschlossen und es läuft.

    Tut mir leid, dass ihr euch da jetzt einen Kopf gemacht habt - da hatte ich echt ein Brett vor dem Kopf, dass ich die einfachsten Debugging-Methoden nicht umsetze... Also Case Closed - Ich war so auf ein Problem in meinem Code fokussiert dass ich überhaupt nicht an die anderen Prozesse gedacht habe, die sich auf der Seite so abspielen.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!