javascript - Rails，点击 link_to 帮助程序后 javascript 未加载

Question

当我在 Rails 中使用 link_to 助手时，我在加载我的 javascript 时遇到了一些问题。当我使用“localhost:3000/products/new”手动输入 url 或重新加载页面时，会加载 javascript，但是当我通过如下所示的链接时，jQuery $(document).ready 不会在新页面上加载。

Link_to，当我点击这个链接时 javascript 没有加载:

<%= link_to "New Product", new_product_path %>

products.js 文件

$(document).ready(function() {
    alert("test");
});

任何帮助将不胜感激。提前致谢!

Answer 1

您使用的是 Rails 4 吗？ (通过在您的控制台中执行 rails -v 找出答案)

这个问题可能是因为新添加了Turbolinks gem 。它使您的应用程序表现得像一个单页 JavaScript 应用程序。它有一些好处 ( it's faster )，但不幸的是它破坏了一些现有的事件，比如 $(document).ready() 因为页面永远不会重新加载。这可以解释为什么 JavaScript 在您直接加载 URL 时有效，但在您通过 link_to 导航到它时却无效。

这是一个 RailsCast关于 Turbolinks。

有几个解决方案。您可以使用 jquery.turbolinks作为一个直接修复，或者您可以将您的 $(document).ready() 语句切换为使用 Turbolinks 'page:change' 事件:

$(document).on('page:change', function() {
    // your stuff here
});

或者，为了与常规页面加载以及 Turbolinks 兼容，您可以执行类似的操作:

var ready = function() {
    // do stuff here.
};

$(document).ready(ready);
$(document).on('page:change', ready);

如果您使用的是 Ruby on Rails >5(您可以通过在控制台中运行 rails -v 来检查)，请使用 'turbolinks:load' 而不是 '页面:更改'

$(document).on('turbolinks:load', ready);