如何在 Rails 4 和 5 中將 $(document).ready() 與 Turbo Links 一起使用？

在Rails 4 中使用$(document).ready() 和Turbo-Links

在Rails 4 中，通常將JavaScript 檔案組織成單獨的實體並編譯它們使用資產管道。然而，當啟用 Turbo-links 時，使用 jQuery 的「ready」事件可能會帶來挑戰。由於渦輪連結避免了整頁重新加載，因此後續頁面點擊會阻止「就緒」函數中程式碼的執行。

解決方案：

確保jQuery 的正常運作具有Turbo Link 的事件，請利用以下內容method:

CoffeeScript:

ready = ->

  ...your coffeescript goes here...

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

這裡，附加行監聽'page:load' 事件，由Turbo-links。

JavaScript：

var ready;
ready = function() {

  ...your javascript goes here...

};

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

Rails 5 的替代方案（Turbolinks 5）：

Rails 5>新事件“turbolinks:load”，該事件在初始頁面和後續頁面上觸發負載。這使我們能夠簡化解決方案：

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

  ...your javascript goes here...

});

這種方法可確保當 Turbo 連結處於活動狀態時 jQuery 事件按預期觸發，從而允許在 Rails 4 應用程式上順利運行 JavaScript 功能。

以上是如何在 Rails 4 和 5 中將 $(document).ready() 與 Turbo Links 一起使用？的詳細內容。更多資訊請關注PHP中文網其他相關文章！