我加载另一个页面后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