DatePicker 清除功能

Question

我在 jsp 页面中有一个带有日期选择器 (jQuery) 的字段。

示例（日期选择器）

http://jqueryui.com/demos/datepicker/#icon-trigger

页面还有一个“清除”按钮功能，可以清除页面上的所有文本字段以及插入这些字段中的文本，包括从日期选择器中选择的日期。

清除按钮代码

<input type="button" name="buttonclear" id="buttonclear" class="buttonstyle_mid" value="Clear"
  onclick="javascript:clearData();" />

javascript clearData() 代码（用于日期字段）

document.getElementById("DateId").value = "";

日期字段代码

<form:input id="DateId" path="date" class="dateInput" size="11" maxlength="10" readonly="true" />

jQuery DatePicker 代码

 <script type="text/javascript">
        jQuery(function($) {
            $('.dateInput').datePicker();
            });
            $('#DateId').datePicker({
                startDate : '01/01/1970',
                endDate : (new Date()).asString()
            });     
    $('#DateId').bind('dpClosed', function(e, selectedDates) {
                var d = selectedDates[0];
                if (d) {
                    d = new Date(d);
                    $('#DateId1').dpSetStartDate(d.addDays(1).asString());
                }
            });
            $('#DateId1').bind('dpClosed', function(e, selectedDates) {
                var d = selectedDates[0];
                if (d) {
                    d = new Date(d);
                    $('#DateId').dpSetEndDate(d.addDays(-1).asString());
                }
            });
 </script>

我的代码有一个主要缺点。如果我从日期选择器中选择 2011 年 8 月 1 日，然后单击“清除”按钮。日期字段被清除，但我无法再次选择相同的日期（即 2011 年 8 月 1 日）。

清除按钮只清除字段内的值，但不会清除底层DatePicker中的日期

我在这个问题上搜索了很多，但找不到关于这个问题的合适解决方案。任何帮助将不胜感激。

谢谢

Answer 1

我认为您需要在 clearData() 函数中添加以下内容：

$('.dateInput').datepicker( "setDate" , null );

这会取消设置日期选择器中的选定值。通过像现在这样简单地清除文本字段值，日期选择器不会被更新，因此它与文本字段值不同步。

Answer 2

这个对我有用： $('.dateInput').datePicker().dpSetSelected(null,true,false);