document.ready不觸發？

Question

這不是沒有加載jQuery的情況，但我確實感覺自己缺少其他簡單的東西...在此登台站點上： https : //hidden-tundra-8656.herokuapp.com/orders ，頁面加載完成后，應自動選擇“野營和背包旅行”。

這是代碼：

$(document).ready( function() {
  console.log("about to trigger initial click")
  $(".category-selector[data-id='"+gon.category_to_start+"']").click()
}) 

絕對不會發生。 有什么想法嗎？ 我唯一能想到的是category-selector是從Ruby插值的，請參見下面的查看代碼，也許這是引起它的原因嗎？

<div class="row">
   <% @item_categories.each do |ic| %>
      <div class="col-xs-6 category-box">
          <div class="row category-row">
              <div class="col-xs-12 table-display category-selector text-center" data-id="<%=ic.id%>">
                  <span class="labeler-response table-cell-display">
                     <%= ic.name %>
                  </span>
              </div>
          </div>
      </div>
  <% end %>
</div>

多一點信息。

代碼中的console.log未觸發，並且定義了gon.category_to_start 。 頁面上的所有其他jquery均正常運行。

在此頁面上，它正在加載application.js和包含問題代碼的單獨的orders/new.js 它先加載jquery，然后加載application.js ，然后再new.js 為了論證，我只是嘗試將代碼片段加載到application.js ，並且在那兒也不起作用。 這在本地服務器上工作正常。

Answer 1

如果使用的是Turbolinks （如果設置Rails項目，則為默認設置），則應將page:load用作事件。

$(document).on("page:load", function() {
  console.log("about to trigger initial click");
  $(".category-selector[data-id='"+gon.category_to_start+"']").click();
});

注意 ：

如果您處於生產模式，請確保運行bin/rake assets:precompile以使資產保持最新狀態。

Answer 2

問題似乎與這條線有關

$(".category-selector[data-id='"+gon.category_to_start+"']").click()

沒有對gon.category_to_start引用，因此data-id可能正在獲取一些未定義的值。

您也可以檢查console.log是否記錄了任何值

應自動選擇“露營和背包旅行”。

但是我看到category-selector在div元素上。 您是否可以選擇div，因為自動選擇適用於復選框或單選按鈕

Answer 3

為什么要在選擇器中包含data-id？ 您可以在准備好文檔時使用$（'。classname'）。trigger。（'click'）

Answer 4

facepalm答案：預編譯資產