javascript - Rails Assets 管道 : JavaScript being executed twice

标签 javascript ruby-on-rails ruby-on-rails-3 asset-pipeline turbolinks

我的 JavaScript 被执行了两次。当我运行 Chrome 调试器时,我注意到单个 JavaScript 文件将首先执行代码,然后 application.js 文件将再次执行代码。

我相信这是因为我最近关闭了预编译,因为我在使用 Heroku 时遇到了问题。在此之后,我运行了 rake assets:precompile

最佳答案

涡轮链接

可能 Turbolinks 有疑问(考虑到您已将其包含在您的 Assets 管道中);虽然这可能不是问题。

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

如果您有 JS触发两次,可能表明 Turbolinks 正在干扰您的 JS。因为您没有包含 logs 中的任何示例,我无法为您提供任何具体信息,但您应该可以通过删除 turbolinks 来测试它包括你的 layout和你的 application list JS 文件:

#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
});

我们总是委托(delegate) document DOM 的元素现在。虽然这可能会导致一些资源问题,但我们发现它使 Rails 应用程序与 Assets 管道更加健壮,因为它允许您真正识别页面上的元素。

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

--

函数

最后,你的 functions可能是问题所在。

如果你有anonymous functions ,或特定事件的函数,您将需要确保它们能够被正确调用。您应该使用 page events 来执行此操作在 JS & Turbolinks :

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

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

关于javascript - Rails Assets 管道 : JavaScript being executed twice,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24624698/

相关文章:

javascript - 在 d3/javascript 中使用嵌套数据

css - 如何使用@media 查询在 rails 中添加照片作为 div 的背景?

ruby-on-rails - 获取多个对象关联的数组

ruby-on-rails - Rails 有两个和多个

javascript - 使用 Ajax 将多个对象发送到 ASP.NET MVC Controller

javascript - 如何使用 Meteor 模板助手编辑 Iron-Router 中作为参数传递的值?

javascript - JS setTimeout 不会等待使用 Scratchpad

ruby-on-rails - Rails 在模型中定义无记录检查

ruby-on-rails - rails 中的多行表单提交按钮

ruby-on-rails - bundler ,Rails3 : how to avoid git check of edge gems in :test group during deploying?