【问题标题】:Change range datepicker (jquery)更改范围日期选择器(jquery)
【发布时间】:2014-11-11 13:01:51
【问题描述】:

我有一个关于 jquery.ui 日期选择器的问题。 我有一个项目,一周从星期五开始。

我没有问题。

问题是 datepicker 找不到方法来进行我几周的选择,从周五开始,还选择默认的周四点击该周的任何地方。

总结:

  1. 每周从星期四开始。
  2. 每周的选择从星期四开始(范围)
  3. OnSelect 周四自动切换到选定的一周。

你能帮忙吗?

我的代码:

$(function() {
var startDate;
var endDate;

var selectCurrentWeek = function() {
    window.setTimeout(function () {
        $('.week-picker').find('.ui-datepicker-current-day a').addClass('ui-state-active')
    }, 1);
}

$('.week-picker').datepicker( {
    showOtherMonths: true,
    selectOtherMonths: true,
    firstDay: 5,
    dateFormat: "dd/mm/yy",
    maxDate : "+0",
    onSelect: function(dateText, inst) { 
        var date = $(this).datepicker('getDate');
        startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
        endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
        var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
        $('#startDate').text($.datepicker.formatDate( dateFormat, startDate, inst.settings ));
        $('#endDate').text($.datepicker.formatDate( dateFormat, endDate, inst.settings ));

        selectCurrentWeek();

         //window.location = '<?php echo HTTP_URI; ?>ranking/week?day=' + dateText + '';
    },
    beforeShowDay: function(date) {
        var cssClass = '';
        if(date >= startDate && date <= endDate)
            cssClass = 'ui-datepicker-current-day';
        return [true, cssClass];
    },
    onChangeMonthYear: function(year, month, inst) {
        selectCurrentWeek();
    }
});

$('.week-picker .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); });
$('.week-picker .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); });

});

【问题讨论】:

  • “我有一个项目,星期从星期五开始”...然后“总结:星期从星期四开始。” - 什么??!!
  • uuuups!抱歉,终于从周五开始;)

标签: javascript jquery jquery-ui datepicker


【解决方案1】:

是的!我找到了自己的解决方案。 我的代码

$(function() {

var selectCurrentWeek = function(callback) {
   window.setTimeout(function () {
       $(".week-picker").find("a.ui-state-active").parents("tr").find("a.ui-state-default").each(function(key, node) {
          $(this).addClass("ui-state-active");
        });
         callback();
      }, 1);
}

$('.week-picker').datepicker( {
    showOtherMonths: true,
    selectOtherMonths: true,
    firstDay: 5,
    dateFormat: "dd/mm/yy",
    maxDate : "+0",
    onSelect: function(dateText, inst) { 

          selectCurrentWeek(function() {

              var startDayy = $(".week-picker").find("a.ui-state-active").eq(0);
              var EndDayy = $(".week-picker").find("a.ui-state-active").eq(6);

              var startDay = startDayy.text();
              var EndDay= EndDayy.text();
              var monthStart = startDayy.parent().attr('data-month');
              var monthEnd= EndDayy.parent().attr('data-month');
              var yearStart = startDayy.parent().attr('data-year');
              var yearEnd = EndDayy.parent().attr('data-year');

              if(monthStart < 10){ monthStart = '0'+monthStart; } 
              if(monthEnd < 10){ monthEnd = '0'+monthEnd; } 

              var CompleteStartDay = startDay +'/'+ monthStart +'/'+yearStart;
              var CompleteEndDay = EndDay +'/'+ monthEnd +'/'+yearEnd;

              $('#startDate').text(CompleteStartDay);
              $('#endDate').text(CompleteEndDay);

             //window.location = '<?php echo HTTP_URI; ?>ranking/week?day=' + CompleteStartDay + '';

          });

    }

});

});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-04-19
    • 1970-01-01
    • 1970-01-01
    • 2020-11-29
    • 1970-01-01
    相关资源
    最近更新 更多