在某些情況下$（document）.ready中的元素未定義

Question

這個問題來自

實際上，我能夠找到一個線索，這就是我所發現的。 我有一個js文件：

$(document).ready(function() {
  var myIdElement = $("#some_id");

  //............
  $.ajax({
    url: getFullUrl(myIdElement.val())
  })
  //..........

因此，當我通過鏈接（html鏈接）從另一個頁面進入該頁面時，則myIdElement是undefined 。 但是，當我重新加載頁面時，它開始具有適當的值。 我使用turbolinks。

如何使它在所有情況下都能正常工作？

Answer 1

$(document).ready並不總是在turbolink觸發。 請改用page:load事件。 在第一頁上，它會觸發ready事件，但在隨后的頁面上， document始終處於ready ，因此不會觸發document ready事件。 因此，它會觸發page:load來幫助我們。

function ready () {
  // Your code goes here...
}

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

Answer 2

嘗試這個：

(function($) {
$(document).ready(function() {
  var myIdElement = $("#some_id");

  //............
  $.ajax({
    url: getFullUrl(myIdElement.val())
  })
  //..........
})(jQuery);