jQuery datepicker – 在init之后更改.ui-datepicker-calendar的显示

如何在初始化datepicker之后更改ui-datepicker-calendar类的css display属性？ 我有一个带有可选复选框的html表单，我想从中切换此表的显示。 我尝试过以下方法：

HTML示例：

 
Zeitraum:
 
 - 
 
 
 
 grobe Planung
  

JS第一种方法：

   $(document).ready(function() { $("#datefrom, #dateto").datepicker({ dateFormat: "dd.mm.yy", [...] beforeShow: function(input, inst) { if ($("#dateplanedcheck").is(':checked')) { $(".ui-datepicker-calendar").css("display", "none"); }} }); [...] });  

调用beforeShow，但仍然显示日历。

JS第二种方法：

   $(document).ready(function() { [....] $("#dateplanedcheck").change(function() { if ($(this).is(':checked')) { $(".ui-datepicker-calendar").css("display", "none"); } }); });  

我错过了什么？ 这甚至适用于jQuery吗？ 提前致谢！

Answer 1

因此，如果选中复选框，您是否希望不显示日历？

只是return false; 在beforeShow中。

 $("#datefrom, #dateto").datepicker({ dateFormat: "dd.mm.yy", beforeShow: function(input, inst) { if ($("#dateplanedcheck").prop('checked')) { return false; } } }); 

http://jsfiddle.net/JzbPD/

回答：

仍然显示日历但使其不可见：

BeforeShow无法访问表上的ui-datepicker-calendar，因为它尚未呈现。 应用类似$(inst.dpDiv).addClass('calendar-off') ，然后使用样式.calendar-off table.ui-datepicker-calendar { display none; } 像这样： http ： //jsfiddle.net/JzbPD/4