Jquery无法在Rails中使用Sprockets
Jquery not working with Sprockets in Rails
这是我第一次尝试将Jquery脚本写入rails项目。该项目正在与Heroku合作生产。我已经被困了24个多小时，几乎要发疯了。我能够很好地运行引导程序和引导程序javascript组件。我的.scs样式表加载没有任何问题。
app/assets/javascripts/articles.js（这是我的确切文件，我需要脚本括号吗？）
$('#myCarousl').css('border-color', 'red');
application.html.erb
<!DOCTYPE html>
<html>
<head>
<title><%= full_title(yield(:title)) %></title>
<%= stylesheet_link_tag 'application', media: 'all',
'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<meta name="viewport" content="width=device-width, initial-scale=1">
<%= render 'layouts/shim' %>
</head>
<body>
<%= render 'layouts/header' %>
<div class="container-fluid">
<% flash.each do |message_type, message| %>
<div class="alert alert-<%= message_type %>"><%= message %></div>
<% end %>
<%= debug(params) if Rails.env.development? %>
<%= yield %>
</div>
</body>
</html>
app/assets/javascripts/application.js
//= require social-share-button
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require turbolinks
//= require_tree .
Gemfile
source 'https://rubygems.org
gem 'rails', '4.2.2'
gem 'bootstrap-sass', '3.2.0.0'
gem 'bcrypt', '3.1.7'
gem 'faker', '1.4.2'
gem 'carrierwave', github: 'carrierwaveuploader/carrierwave'
gem 'mini_magick', '3.8.0'
gem 'fog', '1.36.0'
gem 'will_paginate', '3.0.7'
gem 'bootstrap-will_paginate', '0.0.10'
gem 'sass-rails', '5.0.2'
gem 'uglifier', '2.5.3'
gem 'coffee-rails', '4.1.0'
gem 'jquery-rails', '4.0.3'
gem 'turbolinks', '2.3.0'
gem 'jbuilder', '2.2.3'
gem 'sdoc', '0.4.0', group: :doc
gem 'fog-aws'
gem 'activerecord-reputation-system', require: 'reputation_system'
gem 'social-share-button', '~> 0.1.6'
group :development, :test do
gem 'sqlite3', '1.3.9'
gem 'byebug', '3.4.0'
gem 'web-console', '2.0.0.beta3'
gem "spring", group: :development
end
group :test do
gem 'minitest-reporters', '1.0.5'
gem 'mini_backtrace', '0.1.3'
gem 'guard-minitest', '2.3.1'
end
group :production do
gem 'pg', '0.17.1'
gem 'rails_12factor', '0.0.2'
gem 'puma', '2.11.1'
end
config/ininitializers/assets.rb
# Be sure to restart your server when you modify this file.
# Version of your assets, change this if you want to expire all your assets.
Rails.application.config.assets.version = '1.0'
# Add additional assets to the asset load path
# Rails.application.config.assets.paths << Emoji.images_path
# Precompile additional assets.
# application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
# Rails.application.config.assets.precompile += %w( search.js )
配置/环境/生产.rb
Rails.application.configure do
# Settings specified here will take precedence over those in config/application.rb.
# Code is not reloaded between requests.
config.cache_classes = true
# Eager load code on boot. This eager loads most of Rails and
# your application in memory, allowing both threaded web servers
# and those relying on copy on write to perform better.
# Rake tasks automatically ignore this option for performance.
config.eager_load = true
# Full error reports are disabled and caching is turned on.
config.consider_all_requests_local = false
config.action_controller.perform_caching = true
# Enable Rack::Cache to put a simple HTTP cache in front of your application
# Add `rack-cache` to your Gemfile before enabling this.
# For large-scale production use, consider using a caching reverse proxy like
# NGINX, varnish or squid.
# config.action_dispatch.rack_cache = true
# Disable serving static files from the `/public` folder by default since
# Apache or NGINX already handles this.
config.serve_static_files = ENV['RAILS_SERVE_STATIC_FILES'].present?
# Compress JavaScripts and CSS.
config.assets.js_compressor = :uglifier
# config.assets.css_compressor = :sass
# Do not fallback to assets pipeline if a precompiled asset is missed.
config.assets.compile = false
# Asset digests allow you to set far-future HTTP expiration dates on all assets,
# yet still be able to expire them through the digest params.
config.assets.digest = true
# `config.assets.precompile` and `config.assets.version` have moved to config/initializers/assets.rb
# Specifies the header that your server uses for sending files.
# config.action_dispatch.x_sendfile_header = 'X-Sendfile' # for Apache
# config.action_dispatch.x_sendfile_header = 'X-Accel-Redirect' # for NGINX
# Force all access to the app over SSL, use Strict-Transport-Security, and use secure cookies.
config.force_ssl = true
# Use the lowest log level to ensure availability of diagnostic information
# when problems arise.
config.log_level = :debug
# Prepend all log lines with the following tags.
# config.log_tags = [ :subdomain, :uuid ]
# Use a different logger for distributed setups.
# config.logger = ActiveSupport::TaggedLogging.new(SyslogLogger.new)
# Use a different cache store in production.
# config.cache_store = :mem_cache_store
# Enable serving of images, stylesheets, and JavaScripts from an asset server.
# config.action_controller.asset_host = 'http://assets.example.com'
# Ignore bad email addresses and do not raise email delivery errors.
# Set this to true and configure the email server for immediate delivery to raise delivery errors.
# config.action_mailer.raise_delivery_errors = false
# Enable locale fallbacks for I18n (makes lookups for any locale fall back to
# the I18n.default_locale when a translation cannot be found).
config.i18n.fallbacks = true
# Send deprecation notices to registered listeners.
config.active_support.deprecation = :notify
# Use default logging formatter so that PID and timestamp are not suppressed.
config.log_formatter = ::Logger::Formatter.new
# Do not dump schema after migrations.
config.active_record.dump_schema_after_migration = false
end
我相信你可以在这篇文章中找到答案。
根据RailsGuides，Turbolinks会覆盖正常的页面加载过程，因此不会触发"就绪"事件。尝试：
$(document).on('page:change', function () {
$('#myCarousl').css('border-color', 'red');
});
js可能在页面加载之前就已经执行了。
在你的文章中试试这样的东西.js:
$( document ).ready(function() {
$('#myCarousl').css('border-color', 'red');
});
该功能块中的任何内容都将在页面加载后执行。
相关文章：
- 如何从rails中的代码中删除新行( ）
- Rails File_field最大堆栈大小
- angularjs+rails应用程序中未显示模板
- Rails/JSON:如何将JSON用于jquery UI自动完成表单
- Rails 3.2 js.erb文件转义js
- Rails-JQueryUIAutcomplete和AJAX不工作，可以't连接到数据库
- Jquery:代码在rails中的页面加载时未执行
- Rails操作只调用一次，但我在ajax中每秒钟都调用一次
- Rails/Javascript链接到用于切换多个元素的函数
- 在Rails中更新Div，而不更改更新请求后的视图
- Jquery append oly获取循环Rails中的最后一个elemen
- 通过rails中的Ajax在控制器B的每个视图中渲染控制器a的视图
- 使用主干网和rails的静态页面路由
- 将JavaScript变量保存到Rails模型
- Rails:如何向用户预加载消息
- Ajax and Json with Rails
- Ajax调用ERror Cross Origin REquest:在rails中自动完成大学列表
- Jquery无法在Rails中使用Sprockets
- 让 Sprockets 在不使用 Rails/Rack 应用程序时缩小 CSS/JS
- 在Sprockets Rails中启用Uglifier详细日志记录
