Turbolinks
Sie wahrscheinlich haben ein Problem mit Turbolinks
(unter Berücksichtigung Sie es in Ihrem Asset-Pipeline aufgenommen haben); obwohl dies nicht das Problem sein könnte.
Turbolinks soll die Ladezeiten Ihrer Seite beschleunigen, indem Sie das <body>
-Tag Ihrer neuen Seiten mit ajax
laden und das -Tag intakt halten. Dies bedeutet, dass Ihre Anwendung nur den benötigten HTML-Code laden kann, jedoch den JS auf Ihrer Seite durcheinander bringt.
Wenn Sie Ihre JS
zweimal gefeuert haben, könnte ein Zeichen sein, dass Turbolinks Ihren JS stört. Da Sie keine Beispiele aus der logs
enthalten haben, kann ich Ihnen keine spezifischen Informationen geben, aber Sie sollten in der Lage sein, dies zu testen, indem Sie die turbolinks
-Datei aus Ihrer layout
und Ihrer application
Manifest-JS-Datei entfernen:
#app/views/layouts/application.html.erb
= javascript_include_tag "application", "data-turbolinks-track" => false
#app/assets/javascripts/application.js
//= require turbolinks -> remove this line
Wenn Sie dies tun, starten Sie Ihren Server neu & laden Sie die betreffende Seite neu. Wenn es immer noch zurück mit der irrigen Funktionalität kommt, bedeutet dies Turbolinks nicht das Problem ist (und Sie sollten alle die Dinge, setzen Sie geändert)
-
Events
Das andere Problem, das Sie könnte haben ist, wie Sie Ihre Ereignisse aufrufen/auslösen. Dies könnte auf eine Reihe von Gründen, aber Sie sollten auf jeden Fall sehen Sie, wie Sie Ihre JS sind anrufen:
#app/assets/javascripts/application.js
$(document).on("click", ".element", function(){
//your stuff here
});
Wir delegieren immer vom document
Element des DOM jetzt. Obwohl dies zu einigen Ressourcenproblemen führen kann, haben wir festgestellt, dass Rails-Apps mit der Asset-Pipeline wesentlich robuster sind, da Sie Elemente auf der Seite wirklich identifizieren können.
Wenn Sie versuchen, ein Ereignis von einem einzelnen Objekt in Ihrem DOM auszulösen, stellen Sie möglicherweise fest, dass JS das Ereignis zweimal (aus welchem Grund auch immer) "erfasst", was zu Ihrem Problem führt. Versuchen Sie, Ihre Events zu delegieren, die zweimal
genannt werden -
Funktionen
Schließlich Ihre functions
das Problem sein könnte.Wenn Sie anonymous functions oder Funktionen für bestimmte Ereignisse haben, müssen Sie sicherstellen, dass sie korrekt aufgerufen werden können. Sie sollten dies tun, indem page events in JS mit & Turbolinks:
#app/assets/javascripts/application.js
var your_function = function() {
//stuff here
};
$(document).on("page:load ready", your_function);
Ich benutze keine Turbolinks, es sei denn, es ist automatisch in Schienen enthalten 3.2.13 – user2158382
oder es ist nicht im Bootstrap enthalten 3 – user2158382
Danke für die großartige Erklärung Richard –