javascript - 简单的 Jquery 切换不起作用

Question

我有一个非常简单的 Jquery 函数，它模仿许多在线教程中的代码，我已经查看了几个类似的 stackoverflow 问题，但我不明白为什么当我单击链接以显示/隐藏div 称为“高级搜索”。 (我也删除了 turbolinks 但也没有任何反应。我确实在整个应用程序中存在其他 Jquery 代码并且一切正常)。

文章/index.html.erb

    <div class="advanced-search">
       Some code
    </div>

    <a class="show-advanced-search">Advanced Search</a>

文章.js

$(document).ready(function(){
  $('.show-advanced-search').click(function(){
    $('.advanced-search').toggle();  
  });
});

将选择器缩小到 'a.show-advanced-search' 也不起作用。

编辑:

我在下面有另一个名为“articles.coffee”的 Jquery 文件，带有一个 ajax 回调，我认为它可能会影响其他 jQuery 代码。但是，我尝试删除“articles.coffee”，但同样的问题仍然存在。

将 articles.js 中的代码复制并粘贴到浏览器控制台即可。浏览器控制台没有错误。

文章.咖啡

jQuery(document).on 'change', 'select.sortBy', () ->
  $.ajax(
    url: $(this).data('url') + '?type=' + this.value
    type: 'GET'
    contentType: 'script'
    processData: false
  )
  return

我原来的 application.js 文件

//= require rails-ujs
//= require jquery
//= require bootstrap-sprockets
//= require jquery_ujs
//= require jquery.transit.js
//= require turbolinks
//= require articles.js
//= require_tree .

Answer 1

如果您按顺序包含了 jquery.js 和 articles.js。那么下一个问题可能是 turbolinks 如果您正在使用它。

$( document ).on('turbolinks:load', function() {
  // Do your code
})

NOTE : on Rails >= 4 its there. Please check that.