如果您将Javascript分配给一个已经发出重定向的按钮，该脚本会被执行吗？

更新

我发现Turbolinks会导致应用程序中的链接异步加载内容，因此

$（document）.ready（）

只在您访问的第一页激发。因此，添加jQuery turbolinks gem可以解决此问题的页面刷新部分。JS无法在不同的视图上执行，但仍未解决

我有一个JS函数，它拒绝在我使用基础5的Rails 4项目中正确工作。JS在语法上似乎很好，我布置文件的方式也很好。然而，我函数中的目标div行为异常。我越是深入研究它，我就越是困惑于Javascript是如何在Rails中传递的，所以我想在这里问一下

设置是我将JS函数放在

scripts.JS

文件中，该文件位于

app/assets/javascripts

中。我的

application.js

文件包含

/=require\u tree.

，其中应该包含我相信的所有脚本文件

application.js

//= require jquery
//= require jquery.ui.all
//= require jquery_ujs
//= require turbolinks
//= require foundation
//= require_tree .
$(function() {
  $(document).foundation();
});

$(document).ready(function() {
    // Hide after div by default
    $('#after-review').hide();
    $('.instruction #after-review').hide();
    $(".form-actions.review-create .button").on("click", function() {
      alert("I am an alert box!");
      $('#before-review').hide();
      $('#after-review').show();
      $('.instruction #after-review').show();
    });
});

scripts.js

//= require jquery
//= require jquery.ui.all
//= require jquery_ujs
//= require turbolinks
//= require foundation
//= require_tree .
$(function() {
  $(document).foundation();
});

$(document).ready(function() {
    // Hide after div by default
    $('#after-review').hide();
    $('.instruction #after-review').hide();
    $(".form-actions.review-create .button").on("click", function() {
      alert("I am an alert box!");
      $('#before-review').hide();
      $('#after-review').show();
      $('.instruction #after-review').show();
    });
});

我相当确信函数本身在语法上是好的。这是一个简单的，只是隐藏和显示两个div。但这让我感到困惑。当我访问

$（'#after review'）.hide（）的页面时

div最初应该是隐藏的，它不会隐藏…直到我刷新该页面

由于某些原因，JS似乎没有在页面加载时隐藏div。此外，当我单击应该触发事件的按钮时，什么也没有发生。submit按钮从表单重定向到show页面，就像它的本意一样，但div不隐藏/显示

1-为什么我需要刷新页面才能隐藏div。（我已经解决了这个问题）

2-为什么我单击按钮时div不隐藏/显示？实际上，这里的情况类似，我需要在触发任何JS之前刷新页面。即使如此，当我点击按钮时，

警报（“我是一个警报框！”）已触发。但未触发任何其他内容

唯一想到的潜在问题可能是，按钮所在的页面和div应该执行隐藏/显示的页面位于两个单独的视图中。我知道不能在重定向上执行Javascript，但脚本只是显示/隐藏div。因此，我想知道它是否会运行JS并显示/隐藏这些div，即使dis不在执行JS的同一页面上

\u form.html.erb

  <div class="form-actions review-create">
    <%= f.button :submit, :class => "tiny round button" %>
  </div>


“小圆按钮”%>

浏览器中的渲染按钮erb标记

  <div class="form-actions review-create">
    <input class="button tiny round button" name="commit" type="submit" value="Create Review">
  </div>



show.html.erb（显示/隐藏div所在的位置）


各种各样的东西，各种各样的东西。

我很乐意提供任何有用的信息。我真的很想了解这一点
 使用
$（选择器）.on（…）
绑定仅在页面加载中存在元素时有效，而对于turbolinks，除非重新加载页面，否则它可能不会起作用。因此，您应该使用
$（document）进行绑定在任何
$（document）.ready（）调用之外。这将始终监视文档的点击，如果点击恰好来自
”。form-actions.review-create.button“
，它将运行该功能。@ptd这是一个很好的答案，谢谢！尽管如此，该函数仍然无法工作，因为我试图在该函数中操作的div与事件处理程序处于不同的视图中。我想我需要使用jQuery传递一个cookie，该cookie存储我是否提交了评论。然后，我可以使用它来触发erb标记中的if语句以显示正确的div。结果证明，我决定使用工具提示，因为这是一种更好的方法来完成我正在尝试的任务。然而，以不同的观点处理事件是我想了解更多的事情，所以我很高兴我被困在这个问题上。现在，它让我研究和学习它，这是伟大的！一旦我可以创建一个测试用例，我就会发布我的发现。如果你也解决了这个问题，任何其他人都可以随意分享！