所以,如果您使用过日期选择器,那么您就会知道它是如何工作的 - 当您单击与日期选择器关联的字段时,将弹出带有 jquery 的日历框并允许用户选择日期。
基本上,我的时间选择器、时间字段不会发生这种情况。它仅充当文本字段,并且不会弹出时间选择器框供用户选择时间。 Datepicker 工作得很好,但我不确定为什么 Timepicker 不行,因为我以前从未使用过它。
我已经下载了该库,并在 .js 和 .css 文件中需要它,我做错了什么?
event.js.咖啡
jQuery ->
if $('#event_date').length > 0
$('#event_date').datepicker <---datepicker which works
format: 'yyyy-mm-dd'
$('#event_time').timepicker({ 'scrollDefaultNow': true }); <--- time picker which doesn't work
form.html.rb
File Edit Options Tools Rinari nXhtml Buffers Services Help
<%= simple_form_for @event do |f| %>
<h5>Event title:</h5>
<div><%= f.input_field :title, placeholder: "Event title", required: true, autocomplete: :off %></div>
<h5>Event description:</h5>
<div><%= f.input_field :description, placeholder: "Event description", required: true, autocomplete: :off %></div>
<h5>Event date:</h5>
<div><%= f.text_field :date %></div> <---datepicker which works
<div><%= f.text_field :time, id: "event_time" %></div> <--- time picker which doesn't work
<h5>Event location:</h5>
<div><%= f.input_field :location, placeholder: "Event location", required: true, autocomplete: :off %></div>
<div><%= f.submit @event.new_record? ? "Create event" : "Update event" %></div><br />
<% end %>
最佳答案
您需要输入:
$('#event_time').timepicker({ 'scrollDefaultNow': true });
在 jQuery 的文档就绪函数中,就像使用第一次选择器一样:
jQuery ->
$('#event_time').timepicker({ 'scrollDefaultNow': true });
任何 $()
引用 dom 元素的方法需要在 jQuery ->
中函数,以便 dom 准备好并可用于 $()
找到元素并对其采取行动。除非,您在页面底部加载脚本,就在 </body>
上方.
您也不需要检查:
if $('#event_date').length > 0
因为打电话
$('#event_date').datepicker
如果找不到#event_date
,则不会执行任何操作.
关于javascript - Timepicker 无法在 Rails 应用程序上运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20431043/