Bootstrap 日期选择器禁用功能 [英] Bootstrap datepicker disable feature
本文介绍了Bootstrap 日期选择器禁用功能的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我的项目需要一个我认为 bootstrap datepicker 仍然没有提供的功能.我想启用/禁用日期选择器字段,以便用户无法更改其值.类似于只读功能.
I need in my project a feature I think bootstrap datepicker still doesn't offer. I'd like to enable/disable a datepicker field so a user can't be able to change its value. Something like a readOnly functionality.
对此有什么想法吗?
提前致谢.
推荐答案
我找到了一个解决方案,但只是通过修改引导日历代码.覆盖 this._events 部分以禁用 keyup/down 事件对我有用:
I found a solution, but just by modifying the bootstrap calendar code. Overriding the this._events part to disable keyup/down event worked for me:
_buildEvents: function(){
if (this.isInput) { // single input
this._events = [
[this.element, {
focus: $.proxy(this.show, this),
keyup: $.proxy(this.update, this),
keydown: $.proxy(this.keydown, this)
}]
];
}
else if (this.component && this.hasInput){ // component: input + button
this._events = [
// For components that are not readonly, allow keyboard nav
[this.element.find('input'), {
//focus: $.proxy(this.show, this),
//keyup: $.proxy(this.update, this),
//keydown: $.proxy(this.keydown, this)
}],
[this.component, {
click: $.proxy(this.show, this)
}]
];
}
else if (this.element.is('div')) { // inline datepicker
this.isInline = true;
}
else {
this._events = [
[this.element, {
click: $.proxy(this.show, this)
}]
];
}
this._secondaryEvents = [
[this.picker, {
click: $.proxy(this.click, this)
}],
[$(window), {
resize: $.proxy(this.place, this)
}],
[$(document), {
mousedown: $.proxy(function (e) {
// Clicked outside the datepicker, hide it
if (!(
this.element.is(e.target) ||
this.element.find(e.target).length ||
this.picker.is(e.target) ||
this.picker.find(e.target).length
)) {
this.hide();
}
}, this)
}]
];
},
这篇关于Bootstrap 日期选择器禁用功能的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文