从索引链接加载页面时未加载Javascript



我有一个表单,它有大量的Javascript(特别是jquery)。当我通过手动输入url导航到页面时,或者当我从登录页面重定向到它时,所有javascript元素的加载都很好。但是,当我从索引中的链接导航到页面时,除非刷新,否则不会加载任何javascript。(我不知道这是否是索引独有的问题;索引恰好包含到表单的唯一链接)。

我已经将我所有的JavaScript合并到init.js,我在application.js中有required。如下所示:

jQuery(document).ready(function($) {
// scolling accelleration
  $(".anchor_link").click(function(event) {
    event.preventDefault();
    $('html,body').animate( { scrollTop:$(this.hash).offset().top } , 1000);
  } );
  $('#save').click(function(){
    $('#save_alert').animate({"bottom":"100px"}, "slow").delay(800).animate({"bottom":"50px"}, "slow");
  });
//styling radio buttons  
  function radStyle(entity){
    $(entity).find('input[type="radio"]').css("display", "none");
    $(entity).find('input[type="radio"]').parent().prepend('<span class="radiospan fa-stack">')
    $(entity).find("span.radiospan").append('<i class="fa fa-circle fa-stack-2x fa-inverse">')
    $(entity).find('input[type="radio"]:checked').siblings("span.radiospan").append('<i class="fa fa-circle fa-stack-1x">');
  }
//calling radio buttons on document ready
  radStyle(document);
//adding interactive radio button functionality (delegate to provide functionality to dynamically generated fields)
  $('div.form-right').delegate('input[type="radio"]', 'click', function(){
    if($(this).is(':checked')){
      $(this).siblings("span.radiospan").append('<i class="fa fa-circle fa-stack-1x">');
      $(this).closest('span.radio').siblings('span.radio').find('i.fa.fa-circle.fa-stack-1x').remove();
    }
  });
//select menus on initial load
  $('select').customSelect();
//styling select menus and radio buttons upon dynamic content generation
  var nests = [ "dynamic-officer", "dynamic-director", "dynamic-contractor-person", "dynamic-contractor-org", "dynamic-ip", "dynamic-shareholder"];
  nests.forEach(function(nest){
    $("#"+nest).on("cocoon:after-insert", function(e, added_item){
      added_item.find('select').customSelect();
      radStyle(added_item);
    });
  });
} );

还有几张钞票

  • 更让我困惑的是,firebug似乎承认了我的init.js的存在,并且没有在错误控制台中抛出任何东西
  • 我注意到,如果我将init.js中的所有内容复制到视图中的嵌入式<script>部分中,它的加载就很好

无论如何,完全有可能这就是rails的工作方式,我需要在我的视图中使用脚本标记(我以为我读到过它不是,但谁知道呢)。关于这个问题的任何建议都将受到赞赏;提前感谢任何让我明白这一点的人。

如果它与错误有关,我的index.html.erb

<div class="container-fluid">
  <h1>Incorporation#index</h1>
  <table class="table table-hover">
    <% @incorporations.each do |incorporation| %>
      <tr>
    <td class="name">
      <% begin %>
        <%= link_to incorporation.company.names.first.name_string, edit_incorporation_path(incorporation) %>
      <% rescue %>
        <%= link_to "Untitled Company", edit_incorporation_path(incorporation) %>
      <% end %>
    </td>
    <td class="email"><%= link_to incorporation.user.email, incorporation %></td>
    <td class="created_at"><%= link_to incorporation.created_at, edit_incorporation_path(incorporation) %></td>
    <td class="generate"><%= button_to "Generate Documents", incorpgenerate_incorporation_path(incorporation), :remote => true, :method => :post %></td>
      </tr>
    <% end %>
  </table>
</div>

我认为是涡轮链接。

阅读以下内容:Jquery Turbolinks Gem

这似乎是一个与Turbolink gem有关的问题。默认情况下,这个gem与Rails4一起提供,众所周知,它会导致诸如"(document).ready(function($)"之类的javascript调用出现大量问题。原因是Turbolink gem在页面之间导航时避免了完全加载所有应用程序资产(JS和CSS)。

最新更新