Object [object Object] 没有 Rails 和 jQuery 资产管道的方法答案

【问题标题】：Object [object Object] has no method with Rails and jQuery asset pipelineObject [object Object] 没有 Rails 和 jQuery 资产管道的方法
【发布时间】：2013-06-27 03:17:31
【问题描述】：

我的 jQuery 函数之一出现错误：

Uncaught TypeError: Object [object Object] has no method 'timepicker'

我在vendor/assets/javascripts中有jquery.timepicker.js，使用这个library

在我的 app/assets/javascripts/application.js 我有这个

//= require jquery.timepicker

引入 jquery 文件。我什至可以看到它正在使用 chrome 浏览器加载到我的检查元素中。

在我正在编写函数的另一个文件中，我有这个

jQuery ->
  $(".time_avail").timepicker ->

这在浏览器中给了我这个：

(function() {
  jQuery(function() {
    return $(".time_avail").timepicker(function() {});
  });

}).call(this);

我的视图文件确实有带类的输入字段

<input class="time_avail time-picker" id="hour_open_time" name="hour[open_time]" size="30" type="text" />

我做错了什么才应得这个错误？

【问题讨论】：

检查浏览器开发者工具网络选项卡以查看是否下载/包含时间选择器库
尝试在 Firebug 中控制台 $.fn.datepicker()。希望你能得到这个功能
@ArunPJohny 我检查了网络选项卡，它显示在列表中。
@F1beta 我检查了萤火虫并在控制台中输入了你所说的内容并得到了这个TypeError: Object [object Object] has no method 'datepicker'
如果错误显示 datepicker，那么您缺少 jquery-ui 库

标签： jquery ruby-on-rails ruby-on-rails-3.2 asset-pipeline

【解决方案1】：

显然我的 jquery 有冲突，

在我的一个咖啡脚本文件中，我有这样的事情......

jQuery ->
  #more code
  $(".time_avail").timepicker ->

但是当我把它改成这样的时候：

jQuery -> #更多代码

$.noConflic()
  jQuery(document).ready ($) ->
  $(".time_avail").timepicker ->

它工作...不确定这是否是正确的方法，但我终于能够看到点击输入字段时的时间

【讨论】：

【解决方案2】：

当我想向 jQuery 添加一个新方法时，我遇到了同样的问题，并使用了以下内容（摘自 andrewliu 自己的答案）：

application.js.coffee：

jQuery ->
  $.noConflict() ->
    $.fn.isOnScreen = ->
      win = $(window)
      viewport =
        top: win.scrollTop()
        left: win.scrollLeft()

      viewport.right = viewport.left + win.width()
      viewport.bottom = viewport.top + win.height()
      bounds = @offset()
      bounds.right = bounds.left + @outerWidth()
      bounds.bottom = bounds.top + @outerHeight()
      not (viewport.right < bounds.left or viewport.left > bounds.right or viewport.bottom < bounds.top or viewport.top > bounds.bottom)

所以，基本上关键是将额外的 jQuery 方法包装在 noConflict() 中。虽然，我不知道为什么这是必要的。也许其他人可以解释一下。

【讨论】：