我有以下看法：
/views/admin/home/index.html.haml
= render partial: 'general_tab_partial'
.box.boxtab
%article
%h2= _('Global Reporting')
.clearfix
= form_tag '#', :method => :get, id: "filter_form" do
%select{ id: "select_filter"}
%option{value: "all"} All
%option{value: "adults"} Adults
%option{value: "kis"} Kids
%option{value: "teachers"} Teachers
.clearfix
%table.table.table-hover
%thead
%tr
%th= _('Registered users')
%th= _('Activated users')
%th= _('Minutes talked')
%th= _('Nb of calls (nativos diferentes)')
%th= _('Nb of conversations (salas)')
%th= _('Nb of messages')
%th= _('Nb of conversations')
%th= _('Nb of messages')
%th= _('Nb of videos watched')
%th= _('Nb of posts')
%th= _('Average foreign friends per user')
%tbody
%tr
%td= @registred_users
%td= @actived_users
%td= @minutes_talked
%td= @nb_calls
%td
%td
%td
%td
%td
%td= @nb_posts
%td= number_with_precision(@av_foreign, precision: 3)
:javascript
$('select_filter').change(function() {
$(this).parents('form').submit();
});
但是我收到此错误"未捕获的引用错误：未定义$ "，因此javascript不起作用。如果我检查 html 代码，最后有以下几行：
<!--
Javascripts
==================================================
-->
<!-- Placed at the end of the document so the pages load faster -->
<script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.core.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.widget.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.accordion.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.position.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.menu.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.autocomplete.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.button.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.datepicker.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.mouse.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.draggable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.resizable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.dialog.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.droppable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-blind.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-bounce.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-clip.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-drop.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-explode.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-fade.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-fold.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-highlight.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-pulsate.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-scale.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-shake.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-slide.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.effect-transfer.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.progressbar.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.selectable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.slider.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.sortable.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.spinner.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.tabs.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.tooltip.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.ui.all.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-transition.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-alert.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-modal.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-dropdown.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-scrollspy.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-tab.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-tooltip.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-popover.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-button.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-collapse.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-carousel.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-typeahead.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap/bootstrap-affix.js?body=1" type="text/javascript"></script>
<script src="/assets/twitter/bootstrap.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.fancybox.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.fancybox-buttons.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.fancybox-thumbs.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.fancybox-media.js?body=1" type="text/javascript"></script>
<script src="/assets/fancybox.js?body=1" type="text/javascript"></script>
<script src="/assets/zeroclipboard/ZeroClipboard.js?body=1" type="text/javascript"></script>
<script src="/assets/zeroclipboard/asset-path.js?body=1" type="text/javascript"></script>
<script src="/assets/zeroclipboard.js?body=1" type="text/javascript"></script>
<script src="/assets/Placeholders.min.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/automatic_calls.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/bootstrap-rowlink.min.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/calls.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/categories.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/courses.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/draws.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/home.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/kids_contact.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/languages.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/likes.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/schools.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/schools_contacts.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/teachers.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/video_answers.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/video_questions.js?body=1" type="text/javascript"></script>
<script src="/assets/admin/videos.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/activity_posts.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/calls.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/courses.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/draws.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/events.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/friends.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/home.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/invitation_email.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/kid_conversation_messages.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/kid_conversations.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/kid_video_answers.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/kids.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/points.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/post_comments.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/registrations.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/schedules.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/search.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/sessions.js?body=1" type="text/javascript"></script>
<script src="/assets/dashboard/videos.js?body=1" type="text/javascript"></script>
<script src="/assets/date.format.js?body=1" type="text/javascript"></script>
<script src="/assets/errors.js?body=1" type="text/javascript"></script>
<script src="/assets/uservoice.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/confirmations.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/facebook.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/home.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/kids.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/registrations.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/sessions.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/static_pages.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/teachers.js?body=1" type="text/javascript"></script>
<script src="/assets/frontend/tutors.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery-ui-timepicker-addon.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.jcountdown1.4.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.locationpicker.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.mp3.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery.titlealert.min.js?body=1" type="text/javascript"></script>
<script src="/assets/jstz-1.0.4.min.js?body=1" type="text/javascript"></script>
<script src="/assets/prefixfree.min.js?body=1" type="text/javascript"></script>
<script src="/assets/respond.min.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/contacts.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/courses.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/friends.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/home.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/jquery-ui-timepicker-addon.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/search.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/sessions.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/teachers.js?body=1" type="text/javascript"></script>
<script src="/assets/teachers/application.js?body=1" type="text/javascript"></script>
<script src="/assets/tutor/home.js?body=1" type="text/javascript"></script>
<script src="/assets/tutor/sons.js?body=1" type="text/javascript"></script>
<script src="/assets/tutor/tutors.js?body=1" type="text/javascript"></script>
<script src="/assets/ui.multiselect.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>
所以我不明白为什么它不起作用。有什么帮助吗???
你的视图上有这段依赖于jquery的代码（因为它使用了$）
:javascript
$('select_filter').change(function() {
$(this).parents('form').submit();
});
出现"Uncatch ReferenceError： $ is not defined"是因为您的视图在加载 jquery 文件之前尝试执行此 javascript，这发生在文档末尾的以下行：
<script src="/assets/jquery.js?body=1" type="text/javascript"></script>
所以你有两个选择，要么把对jquery库的请求移动到文档的（不是最好的选择，页面在下载文件时会被阻止），或者你可以把你的自定义javascript放在jquery库下面，在一个<script>标签或一个独立的文件中。