我加載另一個頁面后JavaScript停止工作

Question

我是JavaScript的新手，試圖了解為什么on事件監聽器無法正常工作。 我在stackoverflow上找到了類似的帖子，但是該解決方案不適用於我。

var search = function( event ) {
    alert("bobo")
   $.get("http://localhost:3000/search", {"search" : $("#Search-Bar").val()}, function(data, status){
        if(status == "success")
           $(".centering.text-center").html(data)
    })
}

var attachListeners = function(){
    $("#Search").on("click", search)
    $("#SearchIcon").click( () => search() )
    $("#Search-Bar").keypress( event => (event.KeyCode == 13 || event.which == 13) ? search() : undefined )
}

$(document).ready( function(){ 
    attachListeners()
})

我的網站不是單頁應用程序。 我已將偵聽器附加到導航搜索欄，在導航欄上通過導航鏈接加載不同的視圖，並且我的服務器（紅寶石后端）上載了新的HTML頁面。

在第一次加載時，我注意到准備就緒的文檔會被調用，其他所有內容都會起作用。 在並單擊。 使用導航並加載其他html頁面后，事件消失了。 在我的html視圖中，我的搜索欄，searchicon和搜索文本的id始終一致。 我試過使用window.load()並為我的主體添加一個onload屬性<body onload=attachListeners()>但都沒有起作用（也許我沒有正確使用它們）。 我還注意到，當我渲染下一個html視圖時，不會調用docment.ready 。 但是，如果我用F5強制刷新頁面，則該HTML頁面的偵聽器將再次處於活動狀態。 我在這里想念的我不知道的是什么？

Answer 1

看來您可能正在使用自述文件中的Turbolinks ：

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

由於使用該庫，因此頁面只能加載一次，因此普通的javascript window.onload ， DOMContentLoaded和jQuery ready事件在初始頁面加載后不起作用，您必須使用

document.addEventListener("turbolinks:load", function() {

而不是那些。 如果您不熟悉Turbo鏈接，建議您通讀該自述文件以了解其全部內容。

我從來不明白為什么Rails團隊會在Rails中放置這樣的東西並默認啟用它，並且在我所做的每個項目中，自從他們做出更改后，我要做的第一件事就是卸載它，而當我忘記這樣做，我在項目中花了幾個小時之后，想知道為什么我的JavaScript損壞了。

我加載另一個頁面后JavaScript停止工作

問題描述

1 個解決方案

解決方案1
1 已采納 2017-11-15 05:50:44

我加載另一個頁面后JavaScript停止工作

問題描述

1 個解決方案

解決方案1 1 已采納 2017-11-15 05:50:44

解決方案1
1 已采納 2017-11-15 05:50:44