Wie verwende ich $(document).ready() mit Turbo-Links in Rails 4 und 5?

Verwendung von $(document).ready() mit Turbo-Links in Rails 4

In Rails 4 ist es üblich, JavaScript-Dateien in separaten Einheiten zu organisieren und diese zu kompilieren Nutzung der Assets-Pipeline. Die Verwendung des „ready“-Ereignisses von jQuery kann jedoch zu Herausforderungen führen, wenn Turbo-Links aktiviert sind. Da durch Turbo-Linking das Neuladen ganzer Seiten vermieden wird, verhindern nachfolgende Seitenklicks die Ausführung von Code innerhalb der „Ready“-Funktion.

Lösung:

Um die ordnungsgemäße Funktion von jQuery sicherzustellen Bei Veranstaltungen mit Turbo-Links verwenden Sie Folgendes Ansatz:

CoffeeScript:

ready = ->

  ...your coffeescript goes here...

$(document).ready(ready)
$(document).on('page:load', ready)

Hier wartet die zusätzliche Zeile auf das „page:load“-Ereignis, das durch Turbolinks ausgelöst wird.

JavaScript:

var ready;
ready = function() {

  ...your javascript goes here...

};

$(document).ready(ready);
$(document).on('page:load', ready);

Alternative für Rails 5 (Turbolinks 5):

Rails 5 führt ein neues Ereignis „turbolinks:load“ ein, das sowohl beim ersten als auch bei nachfolgenden Seitenladevorgängen ausgelöst wird. Dadurch können wir die Lösung vereinfachen:

$(document).on('turbolinks:load', function() {

  ...your javascript goes here...

});

Dieser Ansatz stellt sicher, dass jQuery-Ereignisse wie erwartet ausgelöst werden, wenn Turbo-Links aktiv sind, was einen reibungslosen Betrieb der JavaScript-Funktionalitäten in Ihrer Rails 4-Anwendung ermöglicht.

Das obige ist der detaillierte Inhalt vonWie verwende ich $(document).ready() mit Turbo-Links in Rails 4 und 5?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!