jQuery Datepicker:根据工作日限制日期选择

时间:2011-04-18 19:44:01

标签: javascript jquery user-interface

是否可以修改jQuery UI Datepicker以仅允许用户选择,例如,星期一?

5 个答案:

答案 0 :(得分:13)

在这里:星期一不可选:

$(document).ready(function(){
    $('input').datepicker({beforeShowDay: function(date){
        return [date.getDay() != 1, ''];
    }});
});

您可以在这里玩的功能示例:http://jsfiddle.net/RaYZ5/19/

API文档:http://docs.jquery.com/UI/Datepicker#event-beforeShowDay

答案 1 :(得分:7)

之前的帖子完全正确。但更具体地说,只是显示星期一:

$('#date').datepicker({ beforeShowDay: function (a){a=a.getDay();return[a==1,""]} });

答案 2 :(得分:1)

是的,与此类似:

$("#datepicker").datepicker({ beforeShowDay: $.datepicker.noWeekends });

您必须编写一个函数来代替$ .datepicker.noWeekends来执行您想要的任何特定事情。

http://docs.jquery.com/UI/Datepicker/noWeekends

答案 3 :(得分:1)

如果您想要非常灵活解决方案并停用指定时间段内您想要的任何日期,您可以执行以下操作:

$ dt_str 将是您要停用的日期。例如,您可以使用PHP构建它,并从数据库中检索日期。

当加载DOM时,调用disableDates()并发生魔法。

var avDays = <?php echo $dt_str ?>;

<script type='text/javascript'>

 $(document).ready(
    function(){
        // Datepicker
        $('.datepicker_event').datepicker(
        {
            inline: true,
            numberOfMonths: 2,
            beforeShowDay: disableDates 
        });
    }
)   

function disableDates(date) {

    var isAvailable = false ;

   // Find the days to deactivate
    if (avDays != null) {
        for (i = 0; i < avDays.length; i++) {
          if (date.getMonth() == avDays[i][0] - 1 && date.getDate() == avDays[i][1] && date.getFullYear() == avDays[i][2]) {
            isAvailable = true;
          }
        }
    }   

    if (isAvailable)  return [true, 'av_day'] ;
    else return [false, ''];
}

</script>

答案 4 :(得分:0)

我知道的最简单的方式:

$("#datepicker").datepicker({ 
    beforeShowDay: function(date) { 
        var day = date.getDay();
        return [(day > 0 && day < 6), ''];
    } 
});