24

这是我的网站:http ://splash.inting.org/wp/

我目前使用Bootstrap Datepicker(范围分支)作为我的 Call Date 字段,它很棒。

虽然我有2 个问题

1)您可以在输入字段中手动输入字符串。这很奇怪,因为eyecon 的原始版本不允许在您输入非日期值时输入当前日期。我尝试了 readonly 属性,但它似乎不起作用,因为它不允许您选择任何日期。

2)我通过修改另一个帖子中的答案将日期输入选择限制为星期二和星期四。加载日期选择器后,选择的默认日期是当前日期,可以是一周中的任何其他日期。我想避免这种情况,只选择周二或周四。

4

5 回答 5

142

覆盖输入控件上的键事件。

<input onkeydown="return false" ... />
于 2015-02-23T09:38:58.270 回答
8

使用 readonly 属性并在 input 元素后附加一个附加组件以在输入后触发 datepicker:

<input type="text" name="CallDate" value="" id="CallDate" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required input-medium date date-pick" size="40" readonly>
<span class="add-on"><i class="icon-calendar"></i></span>

那应该工作。

对于第二个问题,您可以从此处使用日期选择器的修改版本: https ://github.com/eternicode/bootstrap-datepicker并使用选项daysOfWeekDisabled

于 2013-01-14T22:55:29.010 回答
6

我设法得到如下可接受的解决方案:

$(".date").datetimepicker({
    defaultDate: moment(),
    format: 'YYYY-MM-DD'
}).end().on('keypress paste', function (e) {
    e.preventDefault();
    return false;
});

希望它也适合你!

于 2017-09-17T09:22:21.417 回答
4

使用onKeyDown如下属性。它对我有用 [限制日期选择器中的手动输入]

  <input type="text" id="signedDate" name="signedDate" 
  onkeydown="event.preventDefault()" class="form-control input-med datepicker" 
  maxlength="10" placeholder="" />
于 2018-04-02T12:49:20.490 回答
0

禁用输入元素上的键盘事件。

<input onkeydown="return false" ... />

为日期和时间等类型的输入元素禁用鼠标单击事件。

<input type="date" onkeydown="return false" onclick="return false" ... />
<input type="time" onkeydown="return false" onclick="return false" ... />

如您所见,我刚刚为下一代开发人员升级了这个问题的最佳答案。

于 2021-05-20T14:55:30.700 回答