1

范罗德在这里。这是我的第一次，所以对我温柔一点。

请参阅下面的代码。它应该可以工作，是吗？当您单击按钮时，输入字段应显示今天的日期，但今天的日期只闪烁一秒钟，然后该框变为空白。

如果您删除 FORM 标签，那么它会按预期工作。

因此，如果输入字段位于 FORM 元素内，则 setDate() 不起作用。

已经在 Firefox 和 Chrome 下尝试过这个并得到相同的结果。

我在滥用 datePicker 吗？

已经搜索了stackoverflow、专家交流等以寻求解决方案，但没有任何乐趣。

我不敢相信这是一个错误，因为 datePicker 被广泛使用，但我看不到任何其他结论。

我能看到的唯一解决方法是永远不要在 FORM 中包含输入字段（在我的情况下可行但担心未来）或使用 $("#ttdateofbirth').val(...) 有明显的缺点.

有谁知道如何解决这一问题？

谢谢您的意见。

非工作网页：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>DatePicker test</title>
<link rel="stylesheet" href="js/css/ui-lightness/jquery-ui-1.10.0.custom.css"/>
<script type="text/javascript" src="js/js/jquery-1.9.0.js"></script>
<script type="text/javascript" src="js/js/jquery-ui-1.10.0.custom.js"></script>

<style type="text/css">
.datepicker {
    font: 11pt "Trebuchet MS", sans-serif;
    margin: 10px;
}
.inputlabel {
    font: 11pt "Trebuchet MS", sans-serif;
    margin: 3px;
    float:left; clear:left;
    display: block;
}

.ui-datepicker { font-size: 8pt !important; background: #cccccc; }

input {
    float: left;
    margin-bottom: .25em;
    font: 11pt "Trebuchet MS", sans-serif;
    margin: 3px;
    }
button {
    float: left;
    margin-bottom: .25em;
    font: 11pt "Trebuchet MS", sans-serif;
    margin: 3px;
    }

</style>
<script type="text/javascript">
//<![CDATA[
// set up inputs for dates before today's date
$(function(){
    var pickerOpts = {
        showOtherMonths: true,
        selectOtherMonths: true,
        dateFormat: "dd/mm/y",
        showButtonPanel: true,
        changeYear: true,
        changeMonth : true
        };
        $("#ttdateofbirth").datepicker(pickerOpts);
        });

    function setthedate() {
        var adate = new Date();
        $("#ttdateofbirth").datepicker('setDate',adate);
        };
//]]>
</script>

</head>
<body>
<form>
<span class="inputlabel">Date of birth:</span>
<span><input id="ttdateofbirth" type="text"  value=""/>
<button style="float:left;display:inline;" onclick="setthedate()">Set date</button>
</span>
</form>
</body>
</html>
4

1 回答 1

1

在表单中使用<button>元素时，它会提交表单、重新加载页面并清空输入。将其更改为：

<input type="button" style="float:left;display:inline;" onclick="setthedate()" value="Set date">

或使用 return false / preventDefault。

于 2013-01-26T13:00:35.967 回答