$ 未定义,在 Rails 中使用 Select2 插件时未捕获 ReferenceError

$ is not defined, Uncaught ReferenceError while using Select2 plugin with Rails

我正在尝试使用 Select2 插件将搜索栏添加到我的 select 框中。

查看页面控制台时出现以下错误:

Uncaught ReferenceError: $ is not defined

在这里搜索不同的问题让我相信这个错误的发生是因为 jQuery javascript 没有包含在脚本被调用之前。但我仍然找不到让它工作的方法。我该如何修复此错误并使 select2 插件正常工作?

这是 application.js 文件:

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require jquery-fileupload/basic
//= require jquery-fileupload/vendor/tmpl
//= require select2
//= require tinymce
//= require turbolinks
//= require_tree

我已经尝试以多种不同的方式重新排列 select2 在 application.js 文件中的顺序但没有成功(我试图确保 jQuery 在 Select2 之前加载).

这是 index.html.haml 文件:

%select{:id => "test"}
    - @lamps.each do |lamp|
        %option{:value => "1"}= lamp.brand + ' ' + lamp.category + ' ' + lamp.lamptype + ' (' + lamp.cct.to_s + 'K)'

:javascript
    $(document).ready(function() { $("#test").select2(); });

这是 application.html.haml 文件:

!!! 5
%html
  %head
    %title= t('.lspdd_light_spectral_power_dis')
    %meta{:name => "viewport", :content=>"width=device-width, user-scalable=no"}
    = stylesheet_link_tag    "application", media: "all", "data-turbolinks-track" => true
    = javascript_include_tag "application", "data-turbolinks-track" => true, :defer => "defer"
    = javascript_include_tag "d3.min.js", :defer => "defer"
    = csrf_meta_tags

补充信息:

谢谢!

编辑#1:

添加网络开发工具显示信息的屏幕截图。

http://imgur.com/QJGCM2b

如果我理解正确,application-ea826f14bc5ea6f6976b187ce8d3008e.js 文件包含 application.js 文件中提到的所有内容?

如果您已经手动包含所有脚本,请不要使用 //= require_tree。这可能是错误的原因。删除此字符串并尝试重新加载页面

p.s 我还认为你使用的是不正确的 sintax

//= require_tree

正确版本包含点

//= require_tree .

p.p.s. 不是关于你的主要问题,而是你使用的是旧版本的 ruby。检查较新的

还有一件重要的事情 我之前没有提到的。您正在使用 defer="defer" 属性来延迟主脚本加载。内联 javascript 您在主脚本之前加载的页面上键入的内容