javascript - MobiScroll datePicker 重置值 00-000-0000

Question

Mobiscroll 日期选择器

每年应以重置值 00-000-0000 结束，当我单击重置按钮时即可实现重置值。如何实现这一目标。

+----+-----+------+
| 31 | dec | 2014 |
| 00 | 000 | 0000 |  ----->reset value          
| 01 | jan | 2015 |
| 02 | jan | 2015 |
+----+-----+------+
--------------------
|ok| |reset| |cancel|
--------------------

Answer 1

在日期选择器 ScrollView 中添加重置值。修改几行代码mobiscroll.util.datetime.js、mobiscroll.datetimebase.js

在 mobiscroll.datetimebase.js 中，

under variable defaults={}, add partialDate : false, 
add reset values in a wheel generating loop:  for (k = 0; k < 3; k++) {},
if (s.partialDate)
                    {
                        keys.push(-1);
                        values.push('0000');
                    }

替换 mobiscroll.datetimebase.js 中的以下代码

          formatValue: function (d) {
                //return datetime.formatDate(format, getDate(d), s);
                //KKN
                if (d[o["m"]] != "-1" && d[o["d"]] != "0" )
                {
                    datetime.partialDate = false;
                    return datetime.formatDate(format, getDate(d), s);
                }
                else
                {
                    datetime.partialDate = true;


                    var tempDate = [],
                        hideDate = false,
                        hideMonth = false;
                    $.each(['y', 'm', 'd', 'a', 'h', 'i', 's'], function (x, i) {
                            tempDate[o[i]] = d[o[i]];
                    });
                    if (d[o["m"]] == "-1")
                    {
                        //datetime.partialDateFormat = yy;
                        tempDate[o["m"]] = "0";
                        tempDate[o["d"]] = "1";
                        hideMonth = true;
                        hideDate = true;
                    }else if (d[o["d"]] == "0"){
                        //datetime.partialDateFormat = MM-yy;
                        tempDate[o["d"]] = "1";
                        hideDate = true;
                    }   
                    //var dt = getDate (tempDate);
                    var newDt =  datetime.formatDate(format, getDate(tempDate), s, hideDate, hideMonth);
                    datetime.partialDateFormat = s.partialDateFormat;
                    return newDt;
                }

                //return datetime.formatPartialDate(format, d, s ,o);
            },
            parseValue: function (val) {
                if (!val) {
                    innerValues = {};
                }
                var datValue =  getArray(val ? datetime.parseDate(format, val, s) : (s.defaultValue || new Date()), !!val && !!val.getTime);

                var seperator = "-";
                if (format.indexOf ('/') > 0){
                    seperator = "/";
                }
                var dateArray = val.split(seperator);
                switch (dateArray.length)
                {
                    case 1: //Year Only
                        datValue[o["d"]] = 0;
                        datValue[o["m"]] = -1;
                        break;
                    case 2: //Month & Year
                        datValue[o["d"]] = 0;
                        break;
                }
                return datValue;

            },
            validate: function (dw, i, time, dir) {
                //KKN
                var     temp = [],
                        hideDate = false,
                        hideMonth = false;
                var d = inst.getArrayVal(true);
                if (s.partialDate)
                {

                    hideDate = false,
                    hideMonth = false;
                    $.each(['y', 'm', 'd', 'a', 'h', 'i', 's'], function (x, i) {
                            temp[o[i]] = d[o[i]];
                    });
                    if (d[o["m"]] == "-1")
                    {
                        temp[o["m"]] = "0";
                        temp[o["d"]] = "1";
                        hideMonth = true;
                        hideDate = true;
                    }else if (d[o["d"]] == "0"){
                        //datetime.partialDateFormat = MM-yy;
                        temp[o["d"]] = "1";
                        hideDate = true;
                    }   

                    //return true;
                }
                else
                {
                    var validated = getClosestValidDate(getDate(inst.getArrayVal(true)), dir),
                    temp = getArray(validated);
                }



                    y = get(temp, 'y'),
                    m = get(temp, 'm'),
                    minprop = true,
                    maxprop = true;

                $.each(['y', 'm', 'd', 'a', 'h', 'i', 's'], function (x, i) {
                    if (o[i] !== undefined) {
                        var min = mins[i],
                            max = maxs[i],
                            maxdays = 31,
                            val = get(temp, i),
                            t = $('.dw-ul', dw).eq(o[i]);

                        if (i == 'd') {
                            maxdays = s.getMaxDayOfMonth(y, m);
                            max = maxdays;
                            if (regen) {
                                $('.dw-li', t).each(function () {
                                    var that = $(this),
                                        d = that.data('val'),
                                        w = s.getDate(y, m, d).getDay(),
                                        str = dord.replace(/[my]/gi, '').replace(/dd/, (d < 10 ? '0' + d : d) + (s.daySuffix || '')).replace(/d/, d + (s.daySuffix || ''));
                                    $('.dw-i', that).html(str.match(/DD/) ? str.replace(/DD/, '<span class="dw-day">' + s.dayNames[w] + '</span>') : str.replace(/D/, '<span class="dw-day">' + s.dayNamesShort[w] + '</span>'));
                                });
                            }
                        }
                        if (minprop && mind) {
                            min = f[i](mind);
                        }
                        if (maxprop && maxd) {
                            max = f[i](maxd);
                        }
                        if (i != 'y') {
                            var i1 = getIndex(t, min),
                                i2 = getIndex(t, max);
                            $('.dw-li', t).removeClass('dw-v').slice(i1, i2 + 1).addClass('dw-v');
                            if (i == 'd') { // Hide days not in month
                                //$('.dw-li', t).removeClass('dw-h').slice(maxdays).addClass('dw-h');
                                if (s.partialDate){
                                    if (hideMonth)
                                    {
                                        $('.dw-li', t).removeClass('dw-h').slice(1).addClass('dw-h');
                                    }
                                    else{
                                        $('.dw-li', t).removeClass('dw-h').slice(maxdays + 1).addClass('dw-h');
                                    }
                                }
                                else
                                {
                                    $('.dw-li', t).removeClass('dw-h').slice(maxdays).addClass('dw-h');
                                }
                            }
                        }
                        if (val < min) {
                            val = min;
                        }
                        if (val > max) {
                            val = max;
                        }
                        if (minprop) {
                            minprop = val == min;
                        }
                        if (maxprop) {
                            maxprop = val == max;
                        }
                        // Disable some days
                        if (i == 'd') {
                            var first = s.getDate(y, m, 1).getDay(),
                                idx = {};

                            // Set invalid indexes
                            validateDates(invalid, y, m, first, maxdays, idx, 1);
                            // Delete indexes which are valid 
                            validateDates(valid, y, m, first, maxdays, idx, 0);

                            $.each(idx, function (i, v) {
                                if (v) {
                                    $('.dw-li', t).eq(i).removeClass('dw-v');
                                }
                            });
                        }
                    }
                });

                // Invalid times
                if (hasTime) {
                    $.each(['a', 'h', 'i', 's'], function (i, v) {
                        var val = get(temp, v),
                            d = get(temp, 'd'),
                            t = $('.dw-ul', dw).eq(o[v]);

                        if (o[v] !== undefined) {
                            validateTimes(invalid, i, v, temp, y, m, d, t, 0);
                            validateTimes(valid, i, v, temp, y, m, d, t, 1);

                            // Get valid value
                            validValues[i] = +inst.getValidCell(val, t, dir).val;
                        }
                    });
                }

                if (hideMonth)
                {
                        temp[o["m"]] = "-1";
                        temp[o["d"]] = "0";
                }else if (hideDate){
                        //datetime.partialDateFormat = MM-yy;
                        temp[o["d"]] = "0";
                }   

                inst._tempWheelArray = temp;
            }

并在 mobiscroll.util.datetime.js 中，替换以下行

    (function ($, undefined) {
var ms = $.mobiscroll;

ms.datetime = {
    defaults: {
        shortYearCutoff: '+10',
        monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
        monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
        dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
        dayNamesMin: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
        amText: 'am',
        pmText: 'pm',

        getYear: function (d) { return d.getFullYear(); },
        getMonth: function (d) { return d.getMonth(); },
        getDay: function (d) { return d.getDate(); },
        getDate: function (y, m, d, h, i, s, u) { return new Date(y, m, d, h || 0, i || 0, s || 0, u || 0); },
        getMaxDayOfMonth: function (y, m, o) { return 32 - new Date(y, m, 32).getDate(); },
        getWeekNumber: function (d) {
            // Copy date so don't modify original
            d = new Date(d);
            d.setHours(0, 0, 0);
            // Set to nearest Thursday: current date + 4 - current day number
            // Make Sunday's day number 7
            d.setDate(d.getDate() + 4 - (d.getDay() || 7));
            // Get first day of year
            var yearStart = new Date(d.getFullYear(), 0, 1);
            // Calculate full weeks to nearest Thursday
            return Math.ceil((((d - yearStart) / 86400000) + 1) / 7);
        }
    },
    /**
    * Format a date into a string value with a specified format.
    * @param {String} format Output format.
    * @param {Date} date Date to format.
    * @param {Object} [settings={}] Settings.
    * @return {String} Returns the formatted date string.
    */
    formatDate: function (format, date, settings, hideDate, hideMonth) {
        var newformat = format;
        if (!date) {
            return null;
        }
        var s = $.extend({}, ms.datetime.defaults, settings),
            look = function (m) { // Check whether a format character is doubled
                var n = 0;
                while (i + 1 < format.length && format.charAt(i + 1) == m) {
                    n++;
                    i++;
                }
                return n;
            },
            f1 = function (m, val, len) { // Format a number, with leading zero if necessary
                var n = '' + val;
                if (look(m)) {
                    while (n.length < len) {
                        n = '0' + n;
                    }
                }
                return n;
            },
            f2 = function (m, val, s, l) { // Format a name, short or long as requested
                return (look(m) ? l[val] : s[val]);
            },
            f3 = function (m){
                look(m);
                if (newformat.indexOf('/') > 0 ){
                    newformat = newformat.replace(  m +'/', '');
                }
                else
                {
                    newformat = newformat.replace(  m +'-', '');
                }
                newformat = newformat.replace(  m, '');

                if (format.charAt(i+1) == "/" ||format.charAt(i+1) == "-"){//Skip Separator
                    i++;
                }
                return '';
            },
            i,
            year,
            output = '',
            literal = false;
        //return s.getPartialMonth(date, format);
        for (i = 0; i < format.length; i++) {
            if (literal) {
                if (format.charAt(i) == "'" && !look("'")) {
                    literal = false;
                } else {
                    output += format.charAt(i);
                }
            } else {
                switch (format.charAt(i)) {
                    case 'd':
                        if (hideDate)
                        {
                            output += f3('d');
                        }
                        else
                        {
                            output += f1('d', s.getDay(date), 2);
                        }

                        break;
                    case 'D':
                        if (hideDate)
                        {
                            output += f3('D');
                        }
                        else
                        {
                            output += f2('D', date.getDay(), s.dayNamesShort, s.dayNames);
                        }

                        break;
                    case 'o':
                        output += f1('o', (date.getTime() - new Date(date.getFullYear(), 0, 0).getTime()) / 86400000, 3);
                        break;
                    case 'm':
                        if (hideMonth)
                        {
                            output += f3('m');
                        }
                        else
                        {
                            output += f1('m', s.getMonth(date) + 1, 2);
                        }

                        break;
                    case 'M':
                        if (hideMonth)
                        {
                            output += f3('M');
                        }
                        else
                        {
                            output += f2('M', s.getMonth(date), s.monthNamesShort, s.monthNames);
                        }

                        break;
                    case 'y':
                        year = s.getYear(date);
                        output += (look('y') ? year : (year % 100 < 10 ? '0' : '') + year % 100);
                        //output += (look('y') ? date.getFullYear() : (date.getYear() % 100 < 10 ? '0' : '') + date.getYear() % 100);
                        break;
                    case 'h':
                        var h = date.getHours();
                        output += f1('h', (h > 12 ? (h - 12) : (h === 0 ? 12 : h)), 2);
                        break;
                    case 'H':
                        output += f1('H', date.getHours(), 2);
                        break;
                    case 'i':
                        output += f1('i', date.getMinutes(), 2);
                        break;
                    case 's':
                        output += f1('s', date.getSeconds(), 2);
                        break;
                    case 'a':
                        output += date.getHours() > 11 ? s.pmText : s.amText;
                        break;
                    case 'A':
                        output += date.getHours() > 11 ? s.pmText.toUpperCase() : s.amText.toUpperCase();
                        break;
                    case "'":
                        if (look("'")) {
                            output += "'";
                        } else {
                            literal = true;
                        }
                        break;
                    default:
                        output += format.charAt(i);
                }
            }
        }
        ms.partialDateFormat = newformat;
        return output;
    },

    /**
    * Format a date into a string value with a specified format.
    * @param {String} format Output format.
    * @param {Date} date Date to format.
    * @param {Object} [settings={}] Settings.
    * @return {String} Returns the formatted date string.
    */
    formatPartialDate: function (format, date, settings, o) {


        if (!date) {
            return null;
        }

        var tempDate = [],
            hideDate = false,
            hideMonth = false;
        $.each(['y', 'm', 'd', 'a', 'h', 'i', 's'], function (x, i) {
            tempDate[o[i]] = date[o[i]];
        });
        if (date[o["m"]] == "-1")
        {
            tempDate[o["m"]] = "0";
            tempDate[o["d"]] = "1";
            hideMonth = true;
            hideDate = true;

        }else if (date[o["d"]] == "0"){
            tempDate[o["d"]] = "1";
            hideDate = true;
        }
        var t2 = ms.getDate(tempDate);
        var t1 = new Date();

        //var output = ms.formatDate(format, settings.getDate(tempDate), settings, hideDate, hideMonth);
        var output = ms.formatDate(format, tempDate, settings, hideDate, hideMonth);

        return output;

    },  
    /**
    * Extract a date from a string value with a specified format.
    * @param {String} format Input format.
    * @param {String} value String to parse.
    * @param {Object} [settings={}] Settings.
    * @return {Date} Returns the extracted date.
    */
    parseDate: function (format, value, settings) {
        var s = $.extend({}, ms.datetime.defaults, settings),
            def = s.defaultValue || new Date();

        if (!format || !value) {
            return def;
        }

        // If already a date object
        if (value.getTime) {
            return value;
        }

        value = (typeof value == 'object' ? value.toString() : value + '');

        var seperator = "-";
        if (format.indexOf ('/') > 0){
            seperator = "/";
        }
        var dateArray = value.split(seperator);
        //else (value)

        var shortYearCutoff = s.shortYearCutoff,
            year = s.getYear(def),
            month = s.getMonth(def) + 1,
            day = s.getDay(def),
            doy = -1,
            hours = def.getHours(),
            minutes = def.getMinutes(),
            seconds = 0, //def.getSeconds(),
            ampm = -1,
            literal = false, // Check whether a format character is doubled
            lookAhead = function (match) {
                var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) == match);
                if (matches) {
                    iFormat++;
                }
                return matches;
            },
            getNumber = function (match) { // Extract a number from the string value
                lookAhead(match);
                var size = (match == '@' ? 14 : (match == '!' ? 20 : (match == 'y' ? 4 : (match == 'o' ? 3 : 2)))),
                    digits = new RegExp('^\\d{1,' + size + '}'),
                    num = value.substr(iValue).match(digits);

                if (!num) {
                    return 0;
                }
                iValue += num[0].length;
                return parseInt(num[0], 10);
            },
            getName = function (match, s, l) { // Extract a name from the string value and convert to an index
                var names = (lookAhead(match) ? l : s),
                    i;

                for (i = 0; i < names.length; i++) {
                    if (value.substr(iValue, names[i].length).toLowerCase() == names[i].toLowerCase()) {
                        iValue += names[i].length;
                        return i + 1;
                    }
                }
                return 0;
            },
            checkLiteral = function () {
                if (value.charAt(iValue) == '/' || value.charAt(iValue) == '-')
                    iValue++;

            },
            iValue = 0,
            iFormat;

        for (iFormat = 0; iFormat < format.length; iFormat++) {
            if (literal) {
                if (format.charAt(iFormat) == "'" && !lookAhead("'")) {
                    literal = false;
                } else {
                    checkLiteral();
                }
            } else {
                switch (format.charAt(iFormat)) {
                    case 'd':
                        if (dateArray.length <= 2){
                            day = 1;
                            //iValue++;
                        }
                        else{
                            day = getNumber('d');
                        }
                        break;
                    case 'D':
                        getName('D', s.dayNamesShort, s.dayNames);
                        break;
                    case 'o':
                        doy = getNumber('o');
                        break;
                    case 'm':
                        if (dateArray.length == 1){
                            month = 1;
                            //iValue++;

                        }
                        else
                        {
                            month = getNumber('m');
                        }
                        break;
                    case 'M':
                        if (dateArray.length == 1){
                            month = 1;
                            //iValue++;
                        }
                        else
                        {
                            month = getName('M', s.monthNamesShort, s.monthNames);
                        }
                        break;
                    case 'y':
                        year = getNumber('y');
                        break;
                    case 'H':
                        hours = getNumber('H');
                        break;
                    case 'h':
                        hours = getNumber('h');
                        break;
                    case 'i':
                        minutes = getNumber('i');
                        break;
                    case 's':
                        seconds = getNumber('s');
                        break;
                    case 'a':
                        ampm = getName('a', [s.amText, s.pmText], [s.amText, s.pmText]) - 1;
                        break;
                    case 'A':
                        ampm = getName('A', [s.amText, s.pmText], [s.amText, s.pmText]) - 1;
                        break;
                    case "'":
                        if (lookAhead("'")) {
                            checkLiteral();
                        } else {
                            literal = true;
                        }
                        break;
                    default:
                        checkLiteral();
                }
            }
        }
        if (year < 100) {
            year += new Date().getFullYear() - new Date().getFullYear() % 100 +
                (year <= (typeof shortYearCutoff != 'string' ? shortYearCutoff : new Date().getFullYear() % 100 + parseInt(shortYearCutoff, 10)) ? 0 : -100);
        }
        if (doy > -1) {
            month = 1;
            day = doy;
            do {
                var dim = 32 - new Date(year, month - 1, 32).getDate();
                if (day <= dim) {
                    break;
                }
                month++;
                day -= dim;
            } while (true);
        }
        hours = (ampm == -1) ? hours : ((ampm && hours < 12) ? (hours + 12) : (!ampm && hours == 12 ? 0 : hours));

        var date = s.getDate(year, month - 1, day, hours, minutes, seconds);

        if (s.getYear(date) != year || s.getMonth(date) + 1 != month || s.getDay(date) != day) {
            return def; // Invalid date
        }

        return date;
    }
};



// @deprecated since 2.11.0, backward compatibility code
// ---
ms.formatDate = ms.datetime.formatDate;
ms.parseDate = ms.datetime.parseDate;
ms.formatPartialDate = ms.datetime.formatPartialDate;
ms.getDate = ms.datetime.getDate;
ms.partialDate = true;
ms.partialDateFormat = ms.datetime.partialDateFormat;  })(jQuery);

要启用部分日期选择器，只要您想要启用部分日期选择器，请添加partialDate: true。