Question

我创建了一个html表，并将JQuery日期选择器元素绑定到3个输入字段。但是，只有一个日期选择器受到约束。另外两个不受约束。我无法理解错误!!一段HTML代码和脚本如下所示。

<table class="passenger-list">
    <tr>
        <td>Name</td>
        <td>D-O-B</td>
        <td>Passport #</td>
        <td>Expiry Date</td>
        <td>Destination</td>
        <td>Departure Date</td>
        <td>Arrival Date</td>
    </tr>
    <tr>
        <td>
            <input type="text" name="Name" />
        </td>
        <td>
            <input type="text" name="DOB" />
        </td>
                <td>
            <input type="text" name="DOB" id="DOB" />
        </td>
        <td>
            <input type="text" name="PassNum" />
        </td>
        <td>
            <input type="text" name="PassExpiry" />
        </td>
        <td>
            <input type="text" name="Destination" />
        </td>
        <td>
            <input type="text" name="ArrDate" id = "ArrDate"/>
        </td>
        <td>
            <input type="text" name="DepDate" id="DepDate"/>
        </td>
        <td><a class="remove">remove</a></td>
    </tr>
</table>
<a href="#" title="" class="add-passenger">Add Passenger</a>

和Jquery的脚本如下。 ArrDate工作正常，但其他两个没有。

<script>
$("#DOB").datepicker({
        minDate: "-70Y",
        maxDate: "-18Y",
        numberOfMonths: 1
        }
    });
</script>

<script>
$("#ArrDate").datepicker({ 
        minDate: 0,
        maxDate:"+60D",
        numberOfMonths: 2,
        onSelect: function(selected) {
            $("#DepDate").datepicker("option","maxDate", selected)
        }
    });

 $("#DepDate").datepicker({
        minDate: 0,
        maxDate: "+60D",
        numberOfMonths: 2,
        onSelect: function(selected) {
            $("#ArrDate").datepicker("option","minDate", selected)
        }
    });

 </script>

由于

Answer 1

Roamer-1888已回答（发表评论）你的问题。我也检查了它。

这是答案的jsfiddle demo here `

<script>
 $(function(){

$('#DOB').datepicker({
    minDate: "-70Y",
    maxDate: "-18Y",
    numberOfMonths: 1
});

$("#ArrDate").datepicker({ 
    minDate: 0,
    maxDate:"+60D",
    numberOfMonths: 2,
    onSelect: function(selected) {
        $("#ArrDate").datepicker("option","maxDate", selected)
    }}
);

    $("#DepDate").datepicker({
    minDate: 0,
    maxDate: "+60D",
    numberOfMonths: 2,
    onSelect: function(selected) {
        $("#DepDate").datepicker("option","minDate", selected)
    }
});
});
</script>

带有表输入元素的jquery日期选择器

1 个答案: