5

因此，我的第一个 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 调用。

4

4 回答 4

7

看起来像是新Turbolinks功能的副作用。当您单击一个链接时，该页面不会被重新加载——它只是<body>由 AJAX 请求加载。所以：

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

在第二种情况下，<head>没有重新加载涡轮链接，只是身体。所以你留下了旧的<script>，它不会重新运行！

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

于 2013-08-30T03:30:29.297 回答
3

我在 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

并且完美运行！！谢谢！

于 2014-12-05T18:36:08.657 回答
1

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

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

于 2013-08-30T06:51:08.470 回答
0

一种解决方法，而不是真正的解决方案：使用 target='_blank' 作为指向该页面的 url，js 将被正确加载和触发，而无需额外的 gem。

这是我的同样问题：

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

$(function(){...})

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

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

有人有解决方案吗？

于 2013-09-29T04:06:37.867 回答