Rails资产管道：JavaScript被执行两次

Question

我的JavaScript正在执行两次。 当我运行Chrome调试器时，我注意到单个JavaScript文件将在第一次执行代码，然后， application.js文件将再次执行代码。

我相信这种情况正在发生，因为我最近关闭了预编译，因为我遇到了Heroku的问题。 在此之后我运行了rake assets:precompile 。

Answer 1

Turbolinks

您可能对Turbolinks存在问题（考虑到您已将其包含在资产管道中）; 虽然这可能不是问题。

Turbolinks旨在通过使用ajax加载新页面的<body>标记来加快页面加载时间，保持<head>标记完好无损。 这是为了让您的应用程序只加载它需要的HTML，但是在页面上搞乱了JS。

如果你的JS被解雇了两次，那么可能表明Turbolinks正在干扰你的JS。 因为您没有在logs包含任何示例，所以我将无法向您提供任何具体信息，但您应该能够通过从layout和application清单JS文件中删除turbolinks来测试它：

#app/views/layouts/application.html.erb
= javascript_include_tag "application", "data-turbolinks-track" => false

#app/assets/javascripts/application.js
//= require turbolinks -> remove this line

如果这样做，请重新启动服务器并重新加载相关页面。 如果它仍然带有错误的功能，这意味着Turbolinks不是问题（你应该重置你改变的所有东西）

-

活动

您可能遇到的另一个问题是您如何调用/触发事件。 这可能有很多原因，但你一定要看看你如何调用你的JS：

#app/assets/javascripts/application.js
$(document).on("click", ".element", function(){
    //your stuff here
});

我们现在总是从DOM的document元素委托。 虽然这可能会导致一些资源问题，但我们发现它使得Rails应用程序在Asset Pipeline中更加强大，因为它允许您真正识别页面上的元素。

如果您尝试从DOM上的单个对象触发事件，您可能会发现JS将“捕获”事件两次（无论出于何种原因），从而导致您的问题。 尝试委派两次被调用的事件

-

职能

最后，您的functions可能是问题。

如果您有任何匿名函数或特定事件的函数，则需要确保它们能够被正确调用。 您应该通过在JS和Turbolinks中使用页面事件来完成此操作：

#app/assets/javascripts/application.js
var your_function = function() {
    //stuff here
};

$(document).on("page:load ready", your_function);

Answer 2

我在没有使用turbolinks的rails 3应用程序上遇到了同样的问题。 我能够通过运行来修复它：

rake assets:clean

这个链接帮助了我： Jquery Rails 3 ...表单提交两次...删除两次......帮助

Answer 3

我遇到了这个问题，因为资产管道包括jquery，jquery-ujs和rails-ujs：

 //= require jquery //= require jquery_ujs //= require rails_ujs //= require bootstrap //= require turbolinks //= require_tree .

删除rails_ujs，一切都很好。

Rails资产管道：JavaScript被执行两次

问题描述

3 个解决方案

解决方案1
10 2014-07-08 06:50:13

解决方案2
1 2015-11-05 12:20:07

解决方案3
1 2017-08-06 23:41:45

Rails资产管道：JavaScript被执行两次

问题描述

3 个解决方案

解决方案1 10 2014-07-08 06:50:13

解决方案2 1 2015-11-05 12:20:07

解决方案3 1 2017-08-06 23:41:45

解决方案1
10 2014-07-08 06:50:13

解决方案2
1 2015-11-05 12:20:07

解决方案3
1 2017-08-06 23:41:45