禁用jqueryui datepicker

时间:2011-02-11 08:34:43

标签: javascript jquery

我有一个与输入文本关联的jqueryui datepicker。当我只读取输入文本框时,我不希望显示日期选择器。那可能吗?我将从代码中将readonly属性设置为true或false。

<script>
    $(function() {
        $( "#datepicker" ).datepicker();
    });
    </script>



<div class="demo">

<p>Date: <input type="text" id="CompleteDate"> <input class="change" type="checkbox" name="chkBoxb" id="chkBoxb"> </p>

</div>


j$('#chkBoxb').click(function(){
   var paramChangeBoxes = j$('input:checkbox.change');

 if (j$(this).is(':checked')) {

  paramChangeBoxes.removeAttr('checked');
    j$('#chkBoxb').attr('checked', 'checked');

     j$('#CompleteDate').attr('readonly',false);
     j$("#CompleteDate").datepicker();


 }
 else
 {
  j$('#CompleteDate').attr('readonly',true);
 $( "#CompleteDate:not([readonly])"  ).datepicker();
 }

});

更新了代码

7 个答案:

答案 0 :(得分:33)

像这样禁用它:

$('#dateSelector').datepicker('disable');

并启用它:

$('#dateSelector').datepicker('enable');

以下是一个工作示例:http://jsfiddle.net/CG64h/8/

答案 1 :(得分:9)

我今天碰到了这个,不幸的是,上面提供的答案没有用。阅读datepicker代码,这里是如何在jqueryui 1.10中完成的:

$(selector).datepicker("option", "disabled", true);

答案 2 :(得分:6)

你走了:

<div class="demo">
  <p>Date: <input type="text" id="CompleteDate"> <input class="change" type="checkbox" name="chkBoxb" id="chkBoxb"> </p>
</div>

<script>
  $('#chkBoxb').click(function(){
   if ($(this).is(':checked')) {
     $('#CompleteDate').attr('readonly',false)
       .datepicker();
   } else {
     $('#CompleteDate').attr('readonly',true)
       .datepicker("destroy");
   }
  });
</script>

答案 3 :(得分:1)

答案 4 :(得分:0)

我相信您应该使用2个不同的文本框并根据需要进行切换,以便一次只显示一个。第一个是纯文本框,第二个是应用了jquery Datapicker。

答案 5 :(得分:0)

if($("#").attr("enabled")=="false") {
  $("#").attr("disabled","true");
}

答案 6 :(得分:0)

只需更改选择器并添加:已启用

 $( "#datepicker:enabled" ).datepicker();