0

「bootstrap-datetimepicke」を使用しましたが、jQuery を使用してテキスト ボックスをクリアする際に問題が発生しました。

私のhtmlコードは次のとおりです。

<div class="input-group datetimepicker4">
    <input id="from" name="from" value="<?php echo $from ?>" placeholder="from" data-format="yyyy-MM-dd" readonly="readonly" type="text" style="background-color: #fff">
    <span class="input-group-addon add-on">
        <i data-time-icon="icon-time" data-date-icon="icon-calendar" class="icon-calendar"></i>
    </span>
</div>
<button class="btn btn-default" type="reset" name="reset">Reset</button>

次のコードを使用して、テキストボックスの値をリセットしようとします:

$(function() {
    $('.datetimepicker4').datetimepicker({
        pickTime: false,
        maskInput: true,
    });
});


$(document).ready(function () {
    $('button[type="reset"]').click(function () {
        $('#from').val('');     
        console.log($('#from').val());
    });
});

ボタンを押してコンソールを確認すると、空の値が表示されますが、テキストボックスの値は古い値のままです (入力の値はスクリプトによって埋められますが、ユーザーはリセット ボタンがクリックされている間に値をリセットできるはずです)。

ボタンの種類を「リセット」から「ボタン」に変更したら、別の問題が発生しました。

$(document).ready(function () {
    $('button[type="button"]').click(function () {
        $('#from').val('');     
        console.log($('#from').val());
    });
});

ボタンをクリックすると、要素の検査ウィンドウを開くと値が表示されなくなり、フォームの送信後に同じ値が投稿される古い値が表示されます。

4

1 に答える 1

1

問題はinput、datpicker に関連する が非表示になっているため、正しい値を変更していないためです。setValueAPI を確認すると、非表示フィールドと表示フィールドの同期を保つためにフィールドの値を更新するために使用する必要があるメソッドがあることがわかります。これを試して：

$('.datetimepicker4').data('datetimepicker').setDate(null);
于 2014-04-01T08:52:12.237 に答える