Question

所以我的第一个rails4应用程序遇到了一个奇怪的问题，除非我重新加载页面，否则我的页面javascript不会被触发。

对于我的资产管道JS和内联的content_for JS都是如此。

在我的/assets/javascripts/cars.js文件中：

$(function(){
    $("#car_car_make_id").on("change", function(){
        //SET MODELS
        $.ajax({
            url: "/car_makes/" + $(this).val() + "/car_models",
            type: "GET",
            dataType: "json",
            cache: false
        })
        .done(function(data) { model_list(data) })
        .fail(function() { alert("error"); })
    });
});

function model_list(data) {
    $("#car_car_model_id").empty();
    $.each(data, function(i,v){ 
        $("<option />").val(v.id).text(v.name).appendTo("#car_car_model_id");
    });
    //ON COMPLETE SHOW
    $("#car_model_div").show();
}

带有content_for的页面内联：

<% content_for :head do %>
<script type="text/javascript">
    var tag = document.createElement('script');
    tag.src = "https://www.youtube.com/iframe_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

    var player;
    function onYouTubeIframeAPIReady() {
        player = new YT.Player('yt_vid', {
            height: '390',
            width: '640',
            videoId: '<%= @timeslip.youtube_id %>'
        });
    }
</script>
<% end %>

如果我刷新页面，这两个都只会触发。

例如，如果我点击带有youtube视频的页面链接，则无法加载。但如果我刷新它会。与资产管道脚本相同，如果我首先重新加载页面，它只会调用我的ajax。

Answer 1

看起来像是新Turbolinks功能的副作用。单击链接时，页面不会被重新加载 - 它只是通过AJAX请求加载<body>。所以：

在第一种情况下，$(function{ ... })未运行，因为document.ready仅在第一页加载时触发，而不是重新加载正文。

在第二种情况下，<head>没有重新加载turbolinks，只是身体。所以你留下了旧的<script>并且没有重新运行！

检查turbolinks的一些选项，例如jquery.tubrolinks。

Answer 2

在Rails 4中对我来说同样的问题，并解决了rmosolgo的解决方案。

首先添加jquery-turbolinks gem

gem 'jquery-turbolinks'

然后

bundle install

添加到application.js（正如我在https://github.com/kossnocorp/jquery.turbolinks看到的那样）

//= require jquery
//= require jquery.turbolinks
.
.
.
//= require turbolinks

完美的工作！谢谢！

Answer 3

现在最简单的解决方案是使用jquery-turbolinks gem。只需将其添加到Gemfile，运行bundle install，然后在jquery要求之后立即将//= require jquery.turbolinks添加到application.js文件中。

顺便说一下，最好将turbolinks要求移到该堆栈的底部。

Answer 4

一种解决方法，而不是一个真正的解决方案：对于指向该页面的网址使用target ='_ blank'，js将在没有额外gem的情况下正确加载和触发。

这是我的同样问题：

我使用了一种不同的方法在头部添加特定于页面的js，就像这样 <%= javascript_include_tag "js_for_a" if controller_name == "c" && action_name == "a" %>
在js_for_a.js中，我有这样的事情：
$(function(){...})

当从不包含“js_for_a”的页面请求页面时，将不会加载此js文件。

在我安装gem'jquery-turbolinks'并在正确的位置添加//= require jquery.turbolinks后，js将无法加载。但如果之前被浏览器缓存，则会被触发。

任何人都有解决方案吗？

Rails 4 app ...在开发环境中javascript不会被触发，除非页面被刷新

4 个答案: