在移动设备上禁用 Bootstrap 日期选择器的键盘弹出窗口（Rails 4，Jquery）

Posted 2023-03-31

【中文标题】在移动设备上禁用 Bootstrap 日期选择器的键盘弹出窗口（Rails 4，Jquery）

【英文标题】：Disable Keyboard Popup for Bootstrap datepicker on Mobile (Rails 4, Jquery)

【发布时间】：2016-09-10 20:19:50

【问题描述】：

我有使用 Bootstrap datetimepicker 插件的 Rails 4 应用程序。

我的表单域如下所示：

<%= f.text_field :event_date, id: "event-datepicker", class: "form-control" %>

与之关联的Jquery如下：

$('#event-datepicker').datetimepicker(format: 'LL');

当我单击文本字段并将日历上的选择输入到文本字段时会弹出一个日历。 现在的问题是，在移动设备上，当我选择文本字段时，移动键盘出现在出现的日历上方。如何禁用移动键盘，以便仅从引导程序中选择一个日期日历？我尝试寻找答案，但没有人有我需要的确切场景。

【参考方案1】：

你可以让它只读：

<%= f.text_field :event_date, id: "event-datepicker", class: "form-control", readonly: "true" %>

...并添加一些css来防止灰色背景：

#event-datepicker 
  background-color: white;

【参考方案2】：

添加“.attr('readonly','readonly')”，一切就绪。

$('#event-datepicker').datetimepicker(format: 'LL').attr('readonly','readonly');