2

我在我的主页上有一个引用旋转器。当我直接从浏览器加载页面时（在浏览器中输入地址并按回车键），它工作正常。但是，如果我单击指向我网站中另一个页面的链接，然后链接回主页，它就会停止工作。更具体地说，引号开始重叠，就好像该方法的两个实例正在运行一样。

我认为这可能是javascript加载方式的问题。由于我在网站的另一个页面上有一个选项卡脚本，它可以正常加载，但是如果我链接离开并返回到该页面，它就不再起作用了......

在控制台中没有收到错误。

我在 Ubuntu 12 上运行 Rails 4、Ruby 2.0.0、Foundation，并使用 WebBrick 进行测试。Gemfile 发布在下面：

source 'https://rubygems.org'

# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.0.0'

# Use mysql as the database for Active Record
gem 'mysql2'

# Use SCSS for stylesheets
gem 'sass-rails', '~> 4.0.0'


# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'

# Use CoffeeScript for .js.coffee assets and views
gem 'coffee-rails', '~> 4.0.0'

# See https://github.com/sstephenson/execjs#readme for more supported runtimes
# gem 'therubyracer', platforms: :ruby
#gem 'nokogiri' '~> 1.5.10'
# Use jquery as the JavaScript library
gem 'jquery-rails'

gem 'activerecord-session_store', github: 'rails/activerecord-session_store'

gem 'activemerchant'
# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks
gem 'turbolinks'

gem 'ransack'

gem 'xml-simple'

# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 1.2'

gem 'zurb-foundation'

group :doc do
  # bundle exec rake doc:rails generates the API under doc/api.
  gem 'sdoc', require: false
end

# Use ActiveModel has_secure_password
# gem 'bcrypt-ruby', '~> 3.0.0'

# Use unicorn as the app server
# gem 'unicorn'

# Use Capistrano for deployment
 gem 'capistrano', group: :development

# Use debugger
# gem 'debugger', group: [:development, :test]

脚本：

    function rotateQuotes() {
            var oCurQuote = $('#quotes div.current');
            var oNxtQuote = oCurQuote.next();
            if (oNxtQuote.length == 0)
                oNxtQuote = $('#quotes div:first');

            oCurQuote.removeClass('current').addClass('previous');
            oNxtQuote.css({ opacity: 0.0 }).addClass('current').animate({ opacity: 1.0 }, {duration: 4500},
                function() {
                    oCurQuote.removeClass('previous');});
                    oCurQuote.animate({opacity: 0.0}, {duration: 500});

    }; 

$(function(){

                setInterval(rotateQuotes, 5000);
            });

应用程序.js

// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
4

1 回答 1

4

I'd guess that this is Turbolinks related. From the fine manual:

Events

With Turbolinks pages will change without a full reload, so you can't rely on DOMContentLoaded or jQuery.ready() to trigger your code. Instead Turbolinks fires events on document to provide hooks into the lifecycle of the page.

AFAIK, Rails4 enables turbolinks by default (and you have it in your application.js) so $(function() { ... }) won't always fire when changing pages. You could try binding to turbolinks:load instead:

$(document).on('turbolinks:load', function() {
    setInterval(rotateQuotes, 5000);
});

You might want to bind to turbolinks:before-visit to clean things up as well.

Alternatively, you could disable Turbolinks if you don't care about it.

于 2013-09-04T21:16:47.283 回答