使用jQuery隐藏日期选择器

我正在使用struts2 jquery插件的datepicker如下所示

我想把它隐藏在某些条件上。我写了一个像这样的jquery。

 $("#frdate").hide(); //this will hide textbox of datepicker $("label[for='frdate']").hide(); // this will hide label of datepicker 

但是datepicker按钮仍然显示？ 如何使用jquery隐藏它？

 The generated html code is:   From Date (dd-mm-yyyy):    jQuery(document).ready(function () { jQuery.struts2_jquery_ui.initDatepicker(false); }); jQuery(document).ready(function () { var options_frdate = {}; options_frdate.showOn = "both"; options_frdate.buttonImage = "/ONLINE/struts/js/calendar.gif"; options_frdate.maxDate = "0"; options_frdate.jqueryaction = "datepicker"; options_frdate.id = "frdate"; options_frdate.name = "training.fromDate"; jQuery.struts2_jquery_ui.bind(jQuery('#frdate'),options_frdate); });  

Answer 1

要隐藏您需要的日期选择器

• 从输入文本字段中销毁datepickerfunction
• 隐藏输入文本字段

要显示您需要的日期选择器

• 显示输入文本字段
• 添加日期选择器function

这是演示： http ： //jsfiddle.net/ezKwN/

 function hideIt(){ $( "#frdate" ).datepicker( "destroy" ); $( "#frdate" ).hide(); } function showIt(){ $( "#frdate" ).show(); $( "#frdate" ).datepicker(); } 

我不知道这是否适用于Struts2 jQuery datepicker，但我希望如此。

但是考虑到使用该标签，你是硬编码到页面的function，它不应该是动态的，然后（如果上述解决方案不起作用），如果你需要根据用户交互显示/隐藏它，你应该考虑使用原生的jQuery datepicker而不是Struts2一个（仅用于动态的datepicker）

编辑：作为另一种选择（比使用本机jQuery重新编码所有日期选择器的影响小），您可以简单地将标记封装在

，并隐藏/显示div。

Answer 2

 function hideIt(){ $("#frdate").hide(); $("label[for='frdate']").hide(); $("#frdate").datepicker("destroy" ); } function showIt(){ $("#frdate").show(); $("label[for='frdate']").show(); $("#frdate").datepicker({ showOn : "both", buttonImage : "/path/struts/js/calendar.gif", maxDate : "0", jqueryaction : "datepicker", id : "frdate", name : "training.fromDate" }); } 

Answer 3

您可以使用以下两种方法之一隐藏jquery datepicker：

• 完全删除它： $('input[type=text]#yourInput').datepicker("destroy");
• 隐藏它： $('input[type=text]#yourInput').datepicker("hide");
  • 隐藏它可能更好，因此您不必使用所需的所有参数重新初始化它。

如果需要，您也可以隐藏输入： – $('input[type=text]#yourInput').hide();