Javascript Bootstrap Datepicker(避免文本输入或限制手动输入)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13447057/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap Datepicker (avoid text input or restrict manual input)
提问by AnimaSola
Here is my website: http://splash.inting.org/wp/
这是我的网站:http: //splash.inting.org/wp/
I currently use the Bootstrap Datepicker (range branch)for my Call Date field and it's been great.
我目前在我的 Call Date 字段中使用Bootstrap Datepicker(范围分支),它很棒。
Although I have 2 Problems:
虽然我有两个问题:
1) You can manually enter strings in the input field. This is weird since the original by eyecondisallowed it by entering the current date whenever you enter non-date values. I tried the readonly attribute and it doesn't seem to work because it won't allow you to select any date.
1) 您可以在输入字段中手动输入字符串。这很奇怪,因为当您输入非日期值时,原始 by eyecon会通过输入当前日期来禁止它。我尝试了 readonly 属性,但它似乎不起作用,因为它不允许您选择任何日期。
2) I limited the date input choices to Tuesdays and Thursdays by modifying an answer in another post. Upon loading the datepicker, the default date chosen is the current date, which can be any other day of the week. I want to avoid this and have only either Tuesdays or Thursdays selected.
2)我通过修改另一个帖子中的答案将日期输入选择限制为星期二和星期四。加载日期选择器后,选择的默认日期是当前日期,可以是一周中的任何其他日期。我想避免这种情况,只选择星期二或星期四。
回答by ogborstad
Override the key events on the input control.
覆盖输入控件上的按键事件。
<input onkeydown="return false" ... />
回答by jmartsch
Use the readonly attribute and append an add-on after the input element to trigger the datepicker after the input:
使用 readonly 属性并在 input 元素后附加一个附加组件以在输入后触发日期选择器:
<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>
that should work.
那应该工作。
For the second problem you could use a modified version of the datepicker from here: https://github.com/eternicode/bootstrap-datepickerand use the option daysOfWeekDisabled
对于第二个问题,您可以从这里使用日期选择器的修改版本:https: //github.com/eternicode/bootstrap-datepicker并使用选项daysOfWeekDisabled
回答by Ye Yint
I managed to get acceptable solution as follow:
我设法得到可接受的解决方案如下:
$(".date").datetimepicker({
defaultDate: moment(),
format: 'YYYY-MM-DD'
}).end().on('keypress paste', function (e) {
e.preventDefault();
return false;
});
Hope it works for you too!
希望它也适用于你!
回答by krish007
Use onKeyDownattribute as below. It`s working for me [To Restrict the manual input in datepicker]
使用onKeyDown属性如下。它对我有用[限制日期选择器中的手动输入]
<input type="text" id="signedDate" name="signedDate"
onkeydown="event.preventDefault()" class="form-control input-med datepicker"
maxlength="10" placeholder="" />

