Question

我正在尝试使用DatePicker获取一些值。

这是我正在研究的Jsfiddle。我设法让它在初始阶段工作，但我需要更多的帮助。

/** Days to be disabled as an array */
var disabledSpecificDays = ["12-25-2014", "12-31-2014"];



function disableSpecificDaysAndWeekends(date) {
    var m = date.getMonth();
    var d = date.getDate();
    var y = date.getFullYear();



    for (var i = 0; i < disabledSpecificDays.length; i++) {
        if ($.inArray((m + 1) + '-' + d + '-' + y, disabledSpecificDays) != -1 || new Date() > date) {
            return [false];
        }
    }

    var noWeekend = $.datepicker.noWeekends(date);
    return !noWeekend[0] ? noWeekend : [true];

}


/** init datepicker */
$(document).ready(function () {

   $('#datepicker').datepicker({ dateFormat: 'dd-mm-yy' }).val();

    $('#datepicker').datepicker({
        beforeShowDay: disableSpecificDaysAndWeekends
    });




});

日期是否可以在＆＃34; DD，d MM，yy＆＃34;格式
当文本框加载时（在我选择日期之前），当前日期字段中的默认日期是否显示
想要计算送货和送货日期

Answer 1

我想我已经解决了你的所有三个问题

检查此fiddle

/** Days to be disabled as an array */
var disabledSpecificDays = ["12-25-2014", "12-31-2014"];

function disableSpecificDaysAndWeekends(date) {
    var m = date.getMonth();
    var d = date.getDate();
    var y = date.getFullYear();

    for (var i = 0; i < disabledSpecificDays.length; i++) {
        if ($.inArray((m + 1) + '-' + d + '-' + y, disabledSpecificDays) != -1 || new Date() > date) {
            return [false];
        }
    }

    var noWeekend = $.datepicker.noWeekends(date);
    return !noWeekend[0] ? noWeekend : [true];
}

function calc(dateInText){
    var dateObj = new Date(dateInText);
    var tmrw = new Date(dateInText);
    var shipD = 0;
    while(shipD != 5){
        tmrw.setDate(tmrw.getDate() + 1);
        if(disableSpecificDaysAndWeekends(tmrw)[0]){
            shipD++;
        }
    }
    $('#ShippingDate').val($.datepicker.formatDate('DD, d MM, yy',tmrw));
    var delD = 0;
    while(delD != 6){
        dateObj.setDate(dateObj.getDate() + 1);
        if(disableSpecificDaysAndWeekends(dateObj)[0]){
            delD++;
        }
    }
    $('#DeliveryDate').val($.datepicker.formatDate('DD, d MM, yy',dateObj));
}

/** init datepicker */
$(document).ready(function () {
    var $now = new Date();
    $now.setDate($now.getDate() + 1);
    $('#datepicker').val($.datepicker.formatDate('DD, d MM, yy',$now)).datepicker({
        dateFormat: 'DD, d MM, yy',
        beforeShowDay: disableSpecificDaysAndWeekends,
        onClose : calc
    });
    calc($now);
});

<强>更新

检查this更新的代码

Answer 2

你的前两个问题非常简单，但我不确定你想要的日期格式，一个例子有助于改变它，只需更改默认值的字符串和dateFormat datepicker初始化中的选项。

我知道它是一个外部库，但moment.js非常适合搞乱日期，持续时间和格式。

你的第三个问题非常复杂，应该是关于SO的问题。

有一点需要注意的是，您的datepicker似乎只允许明天的日期，我会在今天的日期填充初始值，因此它被禁用，不确定您是否需要明天的初始值或允许今天被选中，我无法看到今天被禁用的地方。

/** Days to be disabled as an array */
var disabledSpecificDays = ["12-25-2014", "12-31-2014"];

function disableSpecificDaysAndWeekends(date) {
    var m = date.getMonth();
    var d = date.getDate();
    var y = date.getFullYear();

    for (var i = 0; i < disabledSpecificDays.length; i++) {
        if ($.inArray((m + 1) + '-' + d + '-' + y, disabledSpecificDays) != -1 || new Date() > date) {
            return [false];
        }
    }

    var noWeekend = $.datepicker.noWeekends(date);
    return !noWeekend[0] ? noWeekend : [true];

}


/** init datepicker */
$(document).ready(function () {

    // get today's date and format it
    var today = new Date();
    // zero pad the date and month incase they are less than 10
    var dd = ("0" + today.getDate()).slice(-2);
    var mm = ("0" + (today.getMonth() + 1)).slice(-2); // January is 0!
    var yyyy = today.getFullYear();


    var day_names = [
        'Sunday',
        'Monday',
        'Tuesday',
        'Wednesday',
        'Thursday',
        'Friday',
        'Saturday'
    ];

    var month_names = [
        'January',
        'February',
        'March',
        'April',
        'May',
        'June',
        'July',
        'August',
        'September',
        'October',
        'November',
        'December'
    ];

   var day_name = day_names[today.getDay()];
   var month_name = month_names[today.getMonth()];

   $('#datepicker').val(day_name + ', ' + dd + ' ' + month_name + ', ' + yyyy);

   $('#datepicker').datepicker({ 
       dateFormat: 'DD, d MM, yy',
       beforeShowDay: disableSpecificDaysAndWeekends
   });

});

http://jsfiddle.net/vdpzzms2/3/

<强>更新

这有点乱，可以通过一个处理逻辑或使用外部库的中间函数来做得更好但是你去（不考虑周末或禁用日期）：

$('#datepicker').datepicker({ 
   dateFormat: 'DD, d MM, yy',
   beforeShowDay: disableSpecificDaysAndWeekends,
   onSelect: function(date) {
       // alert(date);
       var selected_date = new Date(date);
       var shipping_date = new Date(date);
       shipping_date.setDate(shipping_date.getDate() + 4);
       var delivery_date = new Date(date)
       delivery_date.setDate(delivery_date.getDate() + 5);

       var shipping_dd = ("0" + shipping_date.getDate()).slice(-2);
       var shipping_mm = ("0" + (shipping_date.getMonth() + 1)).slice(-2); //January is 0!
       var shipping_yyyy = shipping_date.getFullYear();
       var shipping_day_name = day_names[shipping_date.getDay()];
       var shipping_month_name = month_names[shipping_date.getMonth()];

       var formatted_shipping_date = shipping_day_name + ', ' + shipping_dd + ' ' + shipping_month_name + ', ' + shipping_yyyy;

       var delivery_dd = ("0" + delivery_date.getDate()).slice(-2);
       var delivery_mm = ("0" + (delivery_date.getMonth() + 1)).slice(-2); //January is 0!
       var delivery_yyyy = delivery_date.getFullYear();
       var delivery_day_name = day_names[delivery_date.getDay()];
       var delivery_month_name = month_names[delivery_date.getMonth()];

       var formatted_delivery_date = delivery_day_name + ', ' + delivery_dd + ' ' + delivery_month_name + ', ' + delivery_yyyy;

       $('#ShippingDate').val(formatted_shipping_date);
       $('#DeliveryDate').val(formatted_delivery_date);

   }
});

http://jsfiddle.net/vdpzzms2/7/

DatePicker中的日期计算

2 个答案: