rails + jquery - 每个页面都有错误，但它仍然有效（有时）

Question

我正在开发一个 Rails 应用程序。它是一个标准应用程序，使用服务器呈现的页面和 jquery。我很难将 jquery 拼凑在一起，我不知道为什么。

我将 jquery 用于几件事：datepicker 和 timepicker。这仅用于用户可以使用的表单，并在用户可以创建/编辑的部分呈现。

我的 javascript 的结构现在我正在使用 1 个名为 main 的 javascript 文件，这在我的 application.js 中是必需的。这就是我正在使用的所有 JS。

application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require bootstrap.min.js
//= require jquery.raty.min.js
//= require jquery.turbolinks
//= require chosen-jquery
//= require turbolinks
//= require main
//= require_tree .

ma​​in.js

$(document).ready(function() {

    // users profile stuff
    if ($('table.calendar tbody tr td ul').hasClass('active-trip')) {
    $('.active-trip').parent().css('background-color', 'orange');
  }

  $("#trip_start_date").datepicker({
    minDate: 1
  });

  $("#start_date").datepicker({
    minDate: 1
  });
  $("#end_date").datepicker({
    minDate: 1
  });
  // ==========


  // js in user's trips
  $('#trip_start_time').timepicker();

  $('#trip_end_time').timepicker();
  // ===========

});

我遇到的问题是我使用的是引导导航栏，上面有一些 JS 效果（下拉菜单）。在这一页（称为“Gyms”或 /gyms 的资源）上，JS 完全中断并让导航栏无用。我得到的错误是

Uncaught TypeError: $(...).timepicker is not a function

我注意到，当我收到一次该错误时，它就会开始重复，并且我在每一页上都得到它。但是，当我返回到使用此代码的表单时，它完全可以正常工作即使出现错误？

这可能是 turbolinks 问题，但我真的不确定。我正在使用这些宝石

gem 'jquery-rails'
gem 'jquery-ui-rails'
gem 'turbolinks'
gem 'jquery-turbolinks'

如果这有什么帮助的话。我也尝试过使用application.html.erb 中呈现的 jQuery CDN 脚本，但这似乎并没有真正帮助或伤害任何东西，而且几乎是中性的。任何帮助将不胜感激

Answer 1

尝试改变要求的顺序：

 //= require jquery
 //= require jquery.turbolinks
 //= require jquery_ujs
 //
 // ... your other scripts here ...
 //
 //= require turbolinks

将 jquery.tublinks 放在所有其他脚本之前，但在 jquery 之后