具有 2 个 jquery 日期选取器操作的表单


Form with 2 jquery date-picker action

我有一个带有签入和签出的表单,它使用 jqyery 日期选择器登记退房日期选取器脚本为:

  // datepicker
    tjq('.datepicker-wrap input').each(function() {
        var minDate = tjq(this).data("min-date");
        if (typeof minDate == "undefined") {
            minDate = 0;
        }
        tjq(this).datepicker({
            showOn: 'button',
            buttonImage: 'images/icon/blank.png',
            buttonText: '',
            buttonImageOnly: true,
            changeYear: false,
            /*showOtherMonths: true,*/
            minDate: minDate,
            dateFormat: "yy-mm-dd",
closeText: 'Inchide',
        prevText: '« Luna precedenta',
        nextText: 'Luna urmÄatoare »',
        currentText: 'Azi',
        monthNames: ['Ianuarie','Februarie','Martie','Aprilie','Mai','Iunie',
        'Iulie','August','Septembrie','Octombrie','Noiembrie','Decembrie'],
        monthNamesShort: ['Ian', 'Feb', 'Mar', 'Apr', 'Mai', 'Iun',
        'Iul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        dayNames: ['Duminica', 'Luni', 'Marti', 'Miercuri', 'Joi', 'Vineri', 'Sambata'],
        dayNamesShort: ['Dum', 'Lun', 'Mar', 'Mie', 'Joi', 'Vin', 'Sam'],
        dayNamesMin: ['Du','Lu','Ma','Mi','Jo','Vi','Sa'],
        weekHeader: 'Sapt',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: false,
            beforeShow: function(input, inst) {
                var themeClass = tjq(input).parent().attr("class").replace("datepicker-wrap", "");
                tjq('#ui-datepicker-div').attr("class", "");
                tjq('#ui-datepicker-div').addClass("ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all");
                tjq('#ui-datepicker-div').addClass(themeClass);
            }
        });
    });

日历是

<input type="text" name="date1" class="input-text full-width hasDatepicker" id="date1"> 
<input type="text" name="date2" class="input-text full-width hasDatepicker" id="date2"> 

如何改进 jquery 日期选择器,以便当我单击其中一个字段(签入或签出)时,它们都会弹出并自动选择"签出"以在签入后 1 天"?

我在JSFiddle中玩了一点,我想我弄清楚了你需要什么。这应该会有所帮助。根据您的需求进行修改:

http://jsfiddle.net/fpcuhv35/

.HTML:

<input type="text" name="date1" class="datepicker" id="date1">
<input type="text" name="date2" class="datepicker" id="date2">

JQuery:

$(document).ready(function(){
    $("#date2").datepicker();
    $("#date1").datepicker({
        onSelect: function(){
            var fecha = $(this).datepicker('getDate');
            $("#date2").datepicker("setDate", new Date(fecha.getTime()));
            $("#date2").datepicker("setDate", "+15d");
        }
    });
});  

@solar411 想补充一点,第二个 setDate 只是在当前日期上增加了 15。此修改后的 JSFiddle 将在先前选择的日期上增加一天。

http://jsfiddle.net/fpcuhv35/2/

$(document).ready(function(){
    $("#date2").datepicker();
    $("#date1").datepicker({
        onSelect: function(){
            var fecha = $(this).datepicker('getDate');
            $("#date2").datepicker("setDate", new Date(fecha.getTime() + 24 * 60 * 60 * 1000));
        }
    });
});