在Rails4上添加JQuery或Javascript加载js.coffee文件

时间:2013-11-24 09:46:59

标签: jquery coffeescript ruby-on-rails-4 jquery-datatables turbolinks

我正在寻找在我的Rails 4项目中添加jquery并且我遇到路径问题。 在我的路径下面和我的application.js配置文件

~/git/myproject$rails console
Loading development environment (Rails 4.0.0)
irb(main):001:0>  y Rails.application.config.assets.paths
---
- /home/flex/git/myproject/app/assets/images
- /home/flex/git/myproject/app/assets/javascripts
- /home/flex/git/myproject/app/assets/stylesheets
- /home/flex/git/myproject/vendor/assets/javascripts
- /home/flex/git/myproject/vendor/assets/stylesheets
- /usr/local/rvm/gems/ruby-1.9.3-p392/gems/jquery-ui-rails-4.1.0/app/assets/images
- /usr/local/rvm/gems/ruby-1.9.3-p392/gems/jquery-ui-rails-4.1.0/app/assets/javascripts
- /usr/local/rvm/gems/ruby-1.9.3-p392/gems/jquery-ui-rails-4.1.0/app/assets/stylesheets
- /usr/local/rvm/gems/ruby-1.9.3-p392/bundler/gems/jquery-datatables-rails-7f79dbfcccc2/app/assets/images
- /usr/local/rvm/gems/ruby-1.9.3-p392/bundler/gems/jquery-datatables-rails-7f79dbfcccc2/app/assets/javascripts
- /usr/local/rvm/gems/ruby-1.9.3-p392/bundler/gems/jquery-datatables-rails-7f79dbfcccc2/app/assets/media
- /usr/local/rvm/gems/ruby-1.9.3-p392/bundler/gems/jquery-datatables-rails-7f79dbfcccc2/app/assets/stylesheets
- /usr/local/rvm/gems/ruby-1.9.3-p392/gems/coffee-rails-4.0.1/lib/assets/javascripts
- /usr/local/rvm/gems/ruby-1.9.3-p392/gems/turbolinks-1.3.1/lib/assets/javascripts
- /usr/local/rvm/gems/ruby-1.9.3-p392/gems/jquery-rails-3.0.4/vendor/assets/javascripts
=> nil
irb(main):002:0>

应用

//= require jquery
//= require jquery_ujs
//= require dataTables/jquery.dataTables

看起来很好,但我无法在/ home / flex / git / myproject / app / assets / javascripts上加载js.coffee文件 如果我尝试添加//= require_tree .,则在加载页面时收到以下错误:

Sprockets::CircularDependencyError in Mycontrollers#index

与:

有关
<%= javascript_include_tag "application", "data-turbolinks-track" => true %>

我不明白为什么jquery代码不起作用。怎么了?

在shops.js.coffee文件下面:

$(document).on 'page:load' ->
    $('#shops').dataTable()

HTML输出下方:

<!DOCTYPE html>
<html>
<head>
<title>Shops</title>
<link data-turbolinks-track="true" href="/assets/application.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/jquery.ui.core.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/jquery.ui.theme.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/dataTables/src/demo_table_jui.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/home.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/scaffolds.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/shops.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/userfeedbacks.css?body=1" media="all" rel="stylesheet" />
<script data-turbolinks-track="true" src="/assets/jquery.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery.turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery_ujs.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/dataTables/jquery.dataTables.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/application.js?body=1"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="EPJ1cg/DFHrGbKKvpmC5a2n8NzowvCdFCsfRRrSkGPk=" name="csrf-token" />
</head>

0 个答案:

没有答案