我有一个使用datepicker
的输入字段。我想知道当我点击该字段时如何禁用datepicker callendar弹出,因为在我的页面上我希望日期选项仅在某些条件下可用。
<input id="date" type="text " class="form-control datepicker" name="date" value="Click to select date">
我尝试过:
$("#date").datepicker('disable');
并且:
$( "#date" ).datepicker( "disabled", true );
没有工作。
答案 0 :(得分:3)
最简单的方法之一是删除该输入字段的所有指针事件。
$("#date").css('pointer-events', 'none');
如果您愿意,这将保持数据完整。
重新启用指针事件。
$("#date").css("pointer-events", "");
答案 1 :(得分:1)
这似乎有效:
$('#date').datepicker('option', 'disabled', t_or_f)
工作示例:
function toggleDatePicker (state) {
// this actually does the magic
$('#date').datepicker('option', 'disabled', !state)
}
$(document).ready(function() {
// init
$('#date').datepicker();
// ignore this, just for the sake of example
$('#butt').on('click', function() {
var st = parseInt($(this).data('state'));
$(this).data('state', st = 1 - st); // toggle 0 and 1
$(this).text(st ? 'Disable' : 'Enable');
toggleDatePicker(Boolean(st));
});
});
&#13;
@import url(https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<input id="date" type="text " class="form-control datepicker" name="date" value="Click to select date">
<button id="butt" data-state="1">Disable</button>
&#13;