molily: Seite per Javascript laden - Javascript ausführen

Beitrag lesen

Hallo,

Das Problem ist, dass alle ready() Sachen bereits ausgelöst sind. Wenn ich z.B. alle Inputfelder blau machen möchte nachdem die Seite geladen wurde dann funktioniert das für die initiale Seite, jedoch nicht für jeglichen Code der per Ajax geladen wird.

Verstehe.

Allgemein: Du baust hier anscheinend eine komplexere Single-Page-App, aber all deine Scripte funktionieren wie auf clientseitig statischen Websites, die mit Page-Reloads arbeiten und auf DOM-ready aktiv werden.

Für deine Zwecke ist DOM-ready nicht geeignet, sondern du brauchst eine saubere und automatische Initialisierung für jeden nachgeladenen Inhalt. Simples Ajax, das bloß statische HTML-Inhalte nachlädt und ins Dokument kippt, ist sooo 2005. ;)

Beim Event-Handling kannst du mit Event-Delegation arbeiten und somit dir eine Re-Initialisierung für nachgeladene Inhalte sparen. jQuery macht das sehr einfach möglich.

Bei komplexeren UI-Controls geht das natürlich nicht. Hier würde ich zu einer bewährten MVC-Struktur raten. Das machen alle Frameworks für JavaScript-Anwendungen so: Angular, Ember, Backbone/Marionette/Chaplin usw. Das würde ich dir letztlich raten, wenn die JS-Logik komplexer wird.

Aktuell würde ich es so machen, dass ich alle ready() Sachen in eine externe Funktion ausgliedere und diese nach dem Ajax response nochmals aufrufe. Das ist aber sehr umständlich.

Ja. Das würde ich nicht empfehlen, denn das wird schnell unübersichtlich und fehleranfällig.

Du vermischt hier zwei Paradigmen, klassische HTML-Dokumente mit JavaScript, das beim DOM-ready aktiv wird, und Single-Page-Verhalten. Wenn deine Site zu letzterem tendiert, solltest du entsprechende Frameworks und Architekturen verwenden.

Mathias