Question

使用这个 https://github.com/jonthornton/jquery-timepicker

演示： http://jonthornton.github.com/jquery-timepicker/

在rails 3.2 app

上

尝试使用datepair示例并且似乎无法弄清楚为什么时间字段不起作用弹出第一个字段的日历，但没有别的。

查看代码：

  %p.datepair{'data-language' => "javascript"}
    = f.text_field :starttime, :class => 'date start'  
    %span.ui-timepicker-container
      = f.text_field :starttime, :class => 'time start ui-timepicker-input', :autocomplete => "off", :value => "12:15am"  
      %ul.ui-timepicker-list{ :tabindex => "-1", :style => "position: absolute; left: 567.667px; z-index: 2; top: 2246.87px; display: none;" }
        %li 12:00am
        %li 12:15am
        ...
        %li 12:30am
        %li 1:00am
    %span.ui.timepicker-container
      = f.text_field :starttime, :class => 'time start ui-timepicker-input', :autocomplete => "off"  
      %ul.ui-timepicker-list.ui-timepicker-with-duration{ :tabindex => "-1", :style => "position: absolute; left: 674.5px; z-index: 2; top: 2422.87px; display: none;"}
      = f.text_field :starttime, :class => 'date start hasDatePicker'

在firebug控制台中我得到了：

$this.timepicker is not a function

$this.timepicker(opts);

Answer 1

我猜你的Rails安装没有加载jquery.timepicker.js

datepair.js使用jquery.timepicker.js和jQuery UI中的datepicker（在你的application.js中使用//= require jquery-ui）。

这就是我在Rails应用程序中的内容：

vendor/assets/javascripts/jquery-timepicker/datepair.js
vendor/assets/javascripts/jquery-timepicker/jquery.timepicker.js
vendor/assets/stylesheets/jquery-timepicker/jquery.timepicker.css

然后在你的一个.js文件中：

//= require jquery-ui-addresspicker/jquery.ui.addresspicker.js
//= require jquery-timepicker/jquery.timepicker.js
//= require jquery-timepicker/datepair.js

并在你的一个.css文件中：

 *= require jquery-timepicker/jquery.timepicker.css

我创建了一个打包这个jQuery插件的gem：https://github.com/tkrotoff/jquery-timepicker-rails

jquery日期/时间选择器问题（timepicker不是函数）

1 个答案: