JavaScript của tôi đang được thực hiện hai lần. Khi tôi chạy trình gỡ lỗi Chrome, tôi nhận thấy rằng tệp JavaScript riêng lẻ sẽ thực thi mã lần đầu tiên, sau đó, tệp application.js sẽ thực thi lại mã.Đường dẫn nội dung đường ray: JavaScript đang được thực thi hai lần
Tôi tin rằng điều này đang xảy ra vì gần đây tôi đã tắt dịch trước vì tôi gặp sự cố với Heroku. Sau này tôi chạy rake assets:precompile.
Turbolinks
Bạn lẽ có một vấn đề với Turbolinks (xem xét bạn đã bao gồm nó trong đường ống dẫn tài sản của bạn); mặc dù điều này có thể không phải là vấn đề.
Turbolinks có nghĩa là tăng tốc thời gian tải trang bằng cách tải thẻ <body> của các trang mới của bạn với ajax, giữ nguyên thẻ <head>. Điều này có nghĩa là để cho ứng dụng của bạn tải chỉ HTML mà nó cần, nhưng làm rối tung JS trên trang của bạn.
Nếu bạn đang gặp phải JS bị bắn hai lần, nó có thể là dấu hiệu cho thấy Turbolinks đang can thiệp vào JS của bạn. Bởi vì bạn chưa bao gồm bất kỳ ví dụ nào từ số logs, tôi sẽ không thể cung cấp cho bạn bất kỳ thông tin cụ thể nào, nhưng bạn có thể kiểm tra điều này bằng cách xóa turbolinks bao gồm từ cả số layout và tệp application tệp kê khai JS của bạn:
#app/views/layouts/application.html.erb
= javascript_include_tag "application", "data-turbolinks-track" => false
#app/assets/javascripts/application.js
//= require turbolinks -> remove this line
Nếu bạn làm điều này, hãy khởi động lại máy chủ của bạn & tải lại trang được đề cập. Nếu nó vẫn trở lại với các chức năng có sai sót, nó có nghĩa Turbolinks không phải là vấn đề (và bạn nên đặt lại tất cả những điều bạn đã thay đổi)
-
Sự kiện
Vấn đề khác mà bạn có thể là cách bạn đang gọi/kích hoạt sự kiện của mình. Điều này có thể xuống đến một số lý do, nhưng bạn chắc chắn nên xem xét làm thế nào bạn đang gọi điện thoại JS của bạn:
#app/assets/javascripts/application.js
$(document).on("click", ".element", function(){
//your stuff here
});
Chúng tôi luôn giao từ các yếu tố document của DOM bây giờ. Mặc dù điều này có thể gây ra một số vấn đề về tài nguyên nhưng chúng tôi nhận thấy rằng các ứng dụng Rails mạnh mẽ hơn nhiều với Đường ống nội dung vì nó cho phép bạn xác định các yếu tố thực sự trên trang.
Nếu bạn đang cố kích hoạt sự kiện từ một đối tượng trên DOM, bạn có thể thấy rằng JS sẽ "nắm bắt" sự kiện hai lần (vì bất kỳ lý do gì), dẫn đến sự cố của bạn. Hãy thử ủy thác sự kiện của bạn đang được gọi là hai lần
-
Chức năng
Cuối cùng, functions của bạn có thể là vấn đề.
Nếu bạn có bất kỳ anonymous functions hoặc chức năng nào cho các sự kiện cụ thể, bạn sẽ cần đảm bảo chúng có thể được gọi chính xác. Bạn nên làm điều này bằng cách sử dụng page events trong JS & Turbolinks:
#app/assets/javascripts/application.js
var your_function = function() {
//stuff here
};
$(document).on("page:load ready", your_function);
Tôi có vấn đề này cùng trên một đường ray 3 ứng dụng không sử dụng turbolinks. Tôi đã có thể sửa chữa nó bằng cách chạy:
rake assets:clean
Liên kết này đã giúp tôi: Jquery Rails 3... form submits twice... deletes twice... help
tôi có kinh nghiệm vấn đề này vì các đường ống dẫn tài sản bao gồm cả jquery, jquery-ujs, và lan can-ujs:
//= require jquery
//= require jquery_ujs
//= require rails_ujs
//= require bootstrap
//= require turbolinks
//= require_tree .rails_ujs Removed và tất cả là tốt.
Tôi không sử dụng turbolinks, trừ khi nó được tự động đưa vào đường ray 3.2.13 – user2158382
hoặc trừ khi nó có trong bootstrap 3 – user2158382
Cảm ơn lời giải thích tuyệt vời Richard –