0

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

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

在 Rails 3.2 应用程序上

尝试使用 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'

在萤火虫控制台中，我得到：

$this.timepicker is not a function

$this.timepicker(opts);
4

1 回答 1

1

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

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

这是我在 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

于 2012-04-14T16:11:41.743 回答