To save time, I'd like to list the main parts of the date function done by jquery.
HTML part:
<label for="from">从</label> <input type="text" id="from" name="from"> <label for="to">到</label> <input type="text" id="to" name="to">
Jquery part:
function dateWidget() { $("#from").datepicker({ defaultDate: "+1w", changeMonth: true, numberOfMonths: 3, onClose: function (selectedDate) { $("#to").datepicker("option", "minDate", selectedDate); } }); $("#to").datepicker({ defaultDate: "+1w", changeMonth: true, numberOfMonths: 3, onClose: function (selectedDate) { $("#from").datepicker("option", "maxDate", selectedDate); } }); //notice the order, it should be put after the upon setting. $("#from,#to").datepicker("option", "dateFormat", 'yy-mm-dd'); }