1

ここにファンロッド。初めてなので優しくしてください。

以下のコードを参照してください。うまくいくはずですよね?ボタンをクリックすると、入力フィールドに今日の日付が表示されますが、今日の日付が1秒間点滅した後、ボックスは空白になります。

FORMタグを削除すると、期待どおりに機能します。

したがって、入力フィールドがFORM要素内にある場合、setDate()は機能しません。

FirefoxとChromeでこれを試しても、同じ結果が得られます。

私はdatePickerを悪用していますか?

解決のためにstackoverflow、専門家の交換などを精査しましたが、喜びはありません。

datePickerは非常に広く使用されているため、これがバグであるとは信じられませんが、他の結論はわかりません。

私が見ることができる唯一の回避策は、FORM内に入力フィールドを持たない(私の場合は実行可能ですが、将来を心配する)か、明らかな欠点がある$( "#ttdateofbirth')。val(...)を使用することです。 。

誰かがこれを修正する方法を知っていますか?

ご意見ありがとうございます。

動作しないWebページ:

<!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 に答える