上一篇: 使用jQuery从html中删除元素下一篇:jquery – 检查日期是否低于日期

jquery-ui-datepicker – 复制Google Analytics DateRange选择器

jQuery 发布时间：2022-03-30 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了jquery-ui-datepicker – 复制Google Analytics DateRange选择器，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

我需要复制Google Analytics日期选择器(以及一些新选项).任何人都可以告诉我如何在两个日期之间突出显示日历上的所有单元格.我的基本 JavaScript是可以的,但我认为我有点超出我的深度.

我正在使用JQuery 1.5.1和JQuery UI 1.8.14.

解决方法

这是使用内置’onSELEct’事件( jsFiddle)的解决方案：

$(document).ready(function() {
    'use Strict';
    var range = {
        'start': null,'stop': null
    };
    $('#picker').datepicker({
        'onSELEct': function(dateText,inst) {
            var d,ds,i,sel,$this = $(this);
            if (range.start === null || range.stop === null) {
                if (range.start === null) {
                    range.start = new Date(dateText);
                } else {
                    range.stop = new Date(dateText);
                }
            }
            if (range.start !== null && range.stop !== null) {
                if ($this.find('td').hasClass('SELEcted')) {
                    //clear SELEcted range
                    $this.children().removeClass('SELEcted');
                    range.start = new Date(dateText);
                    range.stop = null;
                    //call internal method '_updateDatepicker'.
                    inst.inline = true;
                } else {
                    //prevent internal method '_updateDatepicker' from being called.
                    inst.inline = false;
                    if (range.start > range.stop) {
                        d = range.stop;
                        range.stop = range.start;
                        range.start = d;
                    }
                    sel = (range.start.toString() === range.stop.toString()) ? 0 : (new Date(range.stop - range.start)).getDate();
                    for (i = 0; i <= sel; i += 1) {
                        ds = (range.start.getMonth() + 1).toString() + '/' + (range.start.getDate() + i).toString() + '/' + (range.start.getFullYear()).toString();
                        d = new Date(ds);
                        $this.find('td a').filter(function(indeX) {
                            return $(this).text() === d.getDate().toString();
                        }).parents('td').addClass('SELEcted');
                    }
                }
            }
        }
    });
});