JavaScript: jQuery Datepicker - простое выделение определенных дней, кто может помочь? (источник внутри) - PullRequest
4 голосов
/ 29 апреля 2010

Я хочу использовать Datepicker для выделения конкретных дат. Вот мой последний код:

<script type="text/javascript">

var dates = [30/04/2010, 01/05/2010];

$(function(){

    $('#datepicker').datepicker({
        numberOfMonths: [2,3],                
        dateFormat: 'dd/mm/yy',
        beforeShowDay: highlightDays
    });

    function highlightDays(date) {
        for (var i = 0; i < dates.length; i++) {
            if (dates[i] == date) {
                          return [true, 'highlight'];
                  }
          }
          return [true, ''];

 }   

});
 </script>

мой CSS это:

#highlight, .highlight {
    background-color: #cccccc;
}

Хорошо, календарь появляется, но ничего не выделено. Где проблема в моем коде? Если бы кто-то мог помочь, это было бы здорово.

Другой вариант / решение может быть следующим: отключить все даты, но сделать доступными только даты в массиве.

Спасибо!

Ответы [ 2 ]

10 голосов
/ 29 апреля 2010

позвольте рассказать о некоторых проблемах ...

1. даты даты = [30/04/2010, 01/05/2010];

не будет хранить ваши даты, как ожидалось ... он будет выполнять математические операции ...

2. замените его на строку, но в этом формате: mm/dd/yy
, поэтому у вас должно быть что-то вроде:

var dates = ['04/30/2010', '05/01/2010'];

3. используйте эту функцию:

function highlightDays(date) {
        for (var i = 0; i < dates.length; i++) {
            if (new Date(dates[i]).toString() == date.toString()) {              
                          return [true, 'highlight'];
                  }
          }
          return [true, ''];

 } 

4. CSS as:

td.highlight {
    background-color: red;
    border: 1px blue solid;
}

5. демо

3 голосов
/ 07 декабря 2010

Проблема с часовым поясом.

function highlightDays(date) {
    for (var i = 0; i < dates.length; i++) {
        if (new Date(dates[i]).toString().substr(0, 16) == date.toString().substr(0, 16)) {
            return [true, 'highlight'];
        }
    }
    return [true, ''];
 } 
...