Question

我尝试使用Select2插件将搜索栏添加到我的选择框中。

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

未捕获的ReferenceError：$未定义

在这里搜索不同的问题让我相信发生这个错误是因为在调用脚本之前没有包含或放置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

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

这是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

附加信息：

Rails版本：4.0.3
ruby 1.9.3p484（2013-11-22修订版43786）[x86_64-linux]

谢谢！

编辑＃1：

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

http://imgur.com/QJGCM2b

如果我理解正确的应用程序-ea826f14bc5ea6f6976b187ce8d3008e.js文件包含application.js文件中提到的所有内容？

Answer 1

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

<强> P.S 我也认为你使用的是不正确的sintax

//= require_tree

正确的版本包含点

//= require_tree .

<强> p.p.s。不是你的主要问题，但你使用旧版本的红宝石。检查较新的

一件更重要的事情我之前没有提到过的事情。您正在使用defer="defer"属性来处理主脚本加载。内联javascript你在主页上加载的页面上输入的内容

在使用带有Rails的Select2插件时，未定义$，未捕获的ReferenceError

1 个答案: