当您在地址栏中按 Enter 键或刷新页面时，它的工作方式就像 super 按钮一样，但是一旦我单击导航栏中的链接，部分或大部分资源就无法加载。我已经将 "data-no-turbolink"=> true 添加到 link_to 但没有成功。
这是我的application.html.erb
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, shrink-to-fit=no">
<meta name="keywords" content="">
<meta name="description" content="">
<title>Rev</title>
<!-- FAVICON AND APPLE TOUCH -->
<link rel="shortcut icon" href="favicon.png">
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-180x180.png">
<meta name="msapplication-TileImage" content="mstile.png">
<meta name="msapplication-TileColor" content="#94ccdf">
<meta name="theme-color" content="#94ccdf">
<!-- FONTS -->
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700|Open+Sans:300,300i,400,400i,700,700i|Playfair+Display:400,400i" rel="stylesheet">
<%= csrf_meta_tags %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
<div id="main container">
<!-- HEADER -->
<header id="header">
<div class="container-fluid">
<div class="row">
<div class="col-sm-3">
<!-- LOGO -->
<div id="logo">
<a href="index.html">
<%= link_to(image_tag("arrow-down.png", :alt => "arrow", :size => "150x150"), "/") %>
</a>
</div><!-- LOGO -->
</div><!-- col -->
<div class="col-sm-9">
<!-- MENU -->
<nav>
<a id="mobile-menu-button" class="waves" href="#"><i class="custom-icon-menu"></i></a>
<ul class="menu clearfix" id="menu">
<li class="megamenu">
<li class="<%= is_active?(root_path) %>"><%= link_to "Home", root_path, :"data-no-turbolink" => true %></li>
</li>
<li class="megamenu">
<li class="<%= is_active?(menu_team_path) %>"><%= link_to "Meet Team Derrick", menu_team_path, :"data-no-turbolink" => true %></li>
</li>
<li class="megamenu">
<a href="#">New Patient Center</a>
</li>
<li class="megamenu">
<a href="#">About Us</a>
</li>
</ul>
</nav>
</div><!-- col -->
</div><!-- row -->
</div><!-- container -->
</header><!-- HEADER -->
<%= yield %>
</div><!-- MAIN CONTAINER -->
</body>
</html>
application.scss @imports
@import "bootstrap-sprockets";
@import "bootstrap";
@import "plugin";
@import "fontawesome/css/font-awesome.min.css";
@import "animations/animate.min.css";
@import "calendar/beatpicker.min.css";
@import "counters/odometer-theme-default.css";
@import "fancybox/jquery.fancybox.css";
@import "custom-icons/css/custom-icons.min.css";
@import "custom-school-icons/css/custom-school-icons.min.css";
@import "custom-interface-icons/css/custom-interface-icons.min.css";
@import "custom-office-icons/css/custom-office-icons.min.css";
@import "revolutionslider/css/settings.css";
@import "revolutionslider/css/layers.css";
@import "revolutionslider/css/navigation.css";
@import "owl-carousel/owl.carousel.css";
@import "ytplayer/css/jquery.mb.ytplayer.min.css";
application.js 要求
//= require jquery/jquery-2.2.3.min.js
//= require bootstrap-sprockets
//= require viewport/jquery.viewport.js
//= require menu/hoverIntent.js
//= require menu/superfish.js
//= require fancybox/jquery.fancybox.pack.js
//= require revolutionslider/js/jquery.themepunch.tools.min.js
//= require revolutionslider/js/jquery.themepunch.revolution.min.js
//= require revolutionslider/js/extensions/revolution.extension.actions.min.js
//= require revolutionslider/js/extensions/revolution.extension.carousel.min.js
//= require revolutionslider/js/extensions/revolution.extension.kenburn.min.js
//= require revolutionslider/js/extensions/revolution.extension.layeranimation.min.js
//= require revolutionslider/js/extensions/revolution.extension.migration.min.js
//= require revolutionslider/js/extensions/revolution.extension.navigation.min.js
//= require revolutionslider/js/extensions/revolution.extension.parallax.min.js
//= require revolutionslider/js/extensions/revolution.extension.slideanims.min.js
//= require revolutionslider/js/extensions/revolution.extension.video.min.js
//= require owl-carousel/owl.carousel.min.js
//= require parallax/jquery.stellar.min.js
//= require isotope/imagesloaded.pkgd.min.js
//= require isotope/isotope.pkgd.min.js
//= require placeholders/jquery.placeholder.min.js
//= require validate/jquery.validate.min.js
//= require submit/jquery.form.min.js
//= require charts/jquery.easypiechart.min.js
//= require counters/jquerysimplecounter.js
//= require counters/odometer.min.js
//= require statistics/chart.min.js
//= require instafeed/instafeed.min.js
//= require twitter/twitterfetcher.min.js
//= require ytplayer/jquery.mb.ytplayer.min.js
//= require countdown/jquery.countdown.min.js
//= require animations/wow.min.js
//= require rails-ujs
//= require turbolinks
//= require_tree .
Gemfile
source 'https://rubygems.org'
git_source(:github) do |repo_name|
repo_name = "#{repo_name}/#{repo_name}" unless repo_name.include?("/")
"https://github.com/#{repo_name}.git"
end
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 5.1.1'
# Use sqlite3 as the database for Active Record
gem 'pg'
#WOW-Rails
gem 'wow-rails'
#Bootstrap
gem 'bootstrap-sass', '~> 3.3.6'
group :production do
gem 'rails_12factor'
end
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# See https://github.com/rails/execjs#readme for more supported runtimes
# gem 'therubyracer', platforms: :ruby
# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.2'
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.5'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 3.0'
# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'
# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development
group :development, :test do
# Call 'byebug' anywhere in the code to stop execution and get a debugger console
gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
# Adds support for Capybara system testing and selenium driver
gem 'capybara', '~> 2.13'
gem 'selenium-webdriver'
end
group :development do
# Access an IRB console on exception pages or by using <%= console %> anywhere in the code.
gem 'web-console', '>= 3.3.0'
gem 'listen', '>= 3.0.5', '< 3.2'
# Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
gem 'spring'
gem 'spring-watcher-listen', '~> 2.0.0'
end
# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
如有任何帮助，我们将不胜感激!
最佳答案
添加方法:“get”和link_to。
在导航栏中尝试以下代码:
<ul class="menu clearfix" id="menu">
<li class="megamenu">
<li class="<%= is_active?(root_path) %>"><%= link_to "Home", root_path, :"data-no-turbolink" => true, method: "get" %></li>
</li>
<li class="megamenu">
<li class="<%= is_active?(menu_team_path) %>"><%= link_to "Meet Team Derrick", menu_team_path, :"data-no-turbolink" => true, method: "get" %></li>
</li>
<li class="megamenu">
<a href="#">New Patient Center</a>
</li>
<li class="megamenu">
<a href="#">About Us</a>
</li>
</ul>
关于javascript - Ruby on Rails Assets : Links not working properly when clicked，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44513546/