jQuery UI Datepicker – 多个日期选择

有没有办法使用jQuery UI Datepicker小部件来选择多个日期?

所有的帮助是赞赏!
如果不能posable使用jquery UI datepicker那么是有类似的东西吗?

解决方法

我需要做同样的事情,所以写了一些JavaScript来启用这个,使用onSelect和beforeShowDay事件。它保持自己的选定日期数组,所以不幸的是没有集成显示当前日期的文本框等。我只是使用它作为一个内联控件,然后我可以查询数组的当前选定的日期。
我用 this code为基础。
<script type="text/javascript">
// Maintain array of dates
var dates = new Array();

function addDate(date) {
    if (jQuery.inArray(date,dates) < 0) 
        dates.push(date);
}

function removeDate(index) {
    dates.splice(index,1);
}

// Adds a date if we don't have it yet,else remove it
function addOrRemoveDate(date) {
    var index = jQuery.inArray(date,dates);
    if (index >= 0) 
        removeDate(index);
    else 
        addDate(date);
}

// Takes a 1-digit number and inserts a zero before it
function padNumber(number) {
    var ret = new String(number);
    if (ret.length == 1) 
        ret = "0" + ret;
    return ret;
}

jQuery(function () {
    jQuery("#datepicker").datepicker({
        onSelect: function (dateText,inst) {
            addOrRemoveDate(dateText);
        },beforeShowDay: function (date) {
            var year = date.getFullYear();
            // months and days are inserted into the array in the form,e.g "01/01/2009",but here the format is "1/1/2009"
            var month = padNumber(date.getMonth() + 1);
            var day = padNumber(date.getDate());
            // This depends on the datepicker's date format
            var dateString = month + "/" + day + "/" + year;

            var gotDate = jQuery.inArray(dateString,dates);
            if (gotDate >= 0) {
                // Enable date so it can be deselected. Set style to be highlighted
                return [true,"ui-state-highlight"];
            }
            // Dates not in the array are left enabled,but with no extra style
            return [true,""];
        }
    });
});
</script>

相关文章

jQuery插件的种类 1、封装对象方法 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进...
扩展jQuery插件和方法的作用是非常强大的,它可以节省大量开发时间。 入门 编写一个jQuery插件开始于给...
最近项目中需要实现3D图片层叠旋转木马切换的效果,于是用到了jquery.roundabout.js。 兼容性如图: ht...
一、什么是deferred对象? 开发网站的过程中,我们经常遇到某些耗时很长的javascript操作。其中,既有异...
AMD 模块 AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一...