jQuery僅在瀏覽器刷新本地Rails項目后才能工作

Question

我同時擁有這兩個jQuery函數，如果刷新瀏覽器窗口，這些函數就可以正常工作。但是，如果僅單擊該站點，則下面的jQuery將不會執行。 我沒有收到任何控制台錯誤。 我試過將它包裝在$(window).on('load', function() { ... }和$(function(){ ... } 。我也試過將每個包裝起來像這樣： $( ".accordion" ).on('load', function() { ... } 。

任何想法都將不勝感激，因為這是我在Rails生態系統中的第一個項目。

// grow hover for landing page 
$(window).bind("resize",function(){
    console.log($(this).width());
    if($(this).width() <1024){
        $('div.causeBox').addClass('grow')
    }
    else{
        $('div.causeBox').removeClass('grow')
    }
})

// accordion animation
var acc = document.getElementsByClassName("accordion");
var i;

for (i = 0; i < acc.length; i++) {
    acc[i].onclick = function() {
        this.classList.toggle("active");
        var panel = this.nextElementSibling;
        if (panel.style.maxHeight){
            panel.style.maxHeight = null;
        } else {
            panel.style.maxHeight = panel.scrollHeight + "px";
        }
    }
}

這是我的jQuery的問題嗎？ 這對我以前從未遇到過的本地環境有些奇怪嗎？ 感謝您的任何建議。

Answer 1

有可能你的項目使用Turbolinks ，你可以通過查找檢查這個turbolinks在Gemfile中或檢查應用程序/資產/ Java腳本/ application.js中的//= require turbolinks 。 Turbolinks的作用是：

當您跟蹤鏈接時，Turbolinks會自動獲取頁面，交換其<body>並合並其<head> ，而全都不會產生加載整個頁面的費用。

因此，您實際上只加載了一次頁面，然后Turbolinks接管並偽裝了頁面。 在自述文件的“頁面加載時運行的JavaScript”部分中：

您可能習慣於安裝JavaScript行為以響應window.onload ， DOMContentLoaded或jQuery ready事件。 使用Turbolinks，這些事件僅在響應初始頁面加載時才會觸發，而不是在隨后的任何頁面更改之后觸發。

在許多情況下，您可以簡單地調整代碼以偵聽turbolinks:load事件，該事件在初始頁面加載時觸發一次，並在每次訪問Turbolinks之后觸發。
 document.addEventListener("turbolinks:load", function() { // ... }) 

您可以在該自述文件中閱讀有關它的更多信息。

jQuery僅在瀏覽器刷新本地Rails項目后才能工作

問題描述

1 個解決方案

解決方案1
1 已采納 2017-09-01 04:16:35

jQuery僅在瀏覽器刷新本地Rails項目后才能工作

問題描述

1 個解決方案

解決方案1 1 已采納 2017-09-01 04:16:35

解決方案1
1 已采納 2017-09-01 04:16:35