1 
<table class='dates'>
    <form method='post' action=''>
        <tr><td>Start Date of Apply</td><td>: <input type="text" id="apply" name='start' placeholder='DD/MM/YYYY' readonly="true"/></td></tr>
        <tr><td>Last Date of Apply</td><td>: <input type="text" id="last" name='last' placeholder='DD/MM/YYYY' readonly="true" disabled='true'/></td></tr>
        </td><td align='right'><input type='submit' name='cancel' value='Cancel'/></td></tr>
    </form>
    </table>

これは私のhtmlコードです。今までの私のjqueryコードはこれです。

$(function() {
    $('#apply').datepicker({ showOtherMonths: true, selectOtherMonths: true, minDate: 0, maxDate: "2m"});
    $('#apply').onSelect({
        $('#last').prop('disabled', false),
        $('#last').datepicker({ minDate: $('#apply').val()+7D, maxDate: "+4D"})
    });

});

私はjquery 1.10.1でjquery ui datepickerを使用して日付を選択しています。#last日付の選択時に+7日から(#apply).val+4Dの日付範囲を#apply指定し、それを有効にしたいです。どうやってするか？

日付ピッカーを削除するonselect functionと動作します。そうでなければそうではありません。

4

1 に答える 1

2

ワーキング JS フィドル

selectedDate をイベント ハンドラーに渡し、それを日付オブジェクトに変換してから、4 日と 7 日を追加する必要があります。

また、コードを作成する必要があるデフォルトのイベントではなく、datepicker 用に特別に作成されたカスタム イベント ハンドラー onClose を使用してイベントを処理することをお勧めします。

フィドルのコードは次のとおりです。

$('#apply').datepicker({
    showOtherMonths: true,
    selectOtherMonths: true,
    minDate: 0,
    maxDate: "2m",
    onSelect: function(selectedDate){
        console.log(selectedDate);
       $('#last').prop('disabled', false);
       $('#last').datepicker({
         minDate: (function(){                 
            var min = new Date(selectedDate); 
            var newmin = new Date();
             newmin.setDate(min.getDate()+4);
            return newmin;
         })(),
         maxDate:(function(){
            var min = new Date(selectedDate);
            var newmin = new Date();
            newmin.setDate(min.getDate()+7);
            return newmin;
         })()
    });
    }

});

于 2013-08-06T14:48:30.197 に答える