JQuery DatePicker цвет воскресенье красный

Question

Есть ли способ изменить цвет, скажем, красный, по воскресеньям в JQuery Datepicker?

Answer 1

По воскресеньям и субботам вы можете рассмотреть возможность использования того, что JQuery DatePicker добавляет класс .ui-datepicker-week-end, так что вы можете добавить .ui-datepicker-week-end{color:#f00;} вам CSS файл.

Если вы хотите обрабатывать только по воскресеньям, вы должны ретранслировать по факту, что это будет первым или последним столбцом в таблице, сгенерированной jQuery datepicker (зависит от языка).

Общий совет: используйте firefox + firebug (или аналогичный), чтобы проверить код html. он дает много идей о том, как выполнять задачи, связанные с переходом DOM в jquery.

Answer 2

Под вкладкой Theming на documentation page вы можете увидеть пример вывода HTML плагином. Вы должны быть в состоянии использовать селекторы для решения конкретных элементов в HTML:

.ui-datepicker-calendar > tbody td:first-child { 
    background-color: red; 
} 

JQuery:

$(".ui-datepicker-calendar > tbody td:first-child").css("background-color: red"); 

Непроверенные и принимает первый столбец является воскресенье, поэтому может потребоваться немного тонкой настройки. Если воскресенье установлено в другой столбец, вместо этого используйте :nth-child(n).

Answer 3

Предполагая, что первая колонка воскресенье тогда следующий JQuery должен сделать трюк:

$('table.ui-datepicker-calendar td.ui-datepicker-week-end:nth-child(1) a').css({'background':'#f00'}); 

Хотя бы запускаться каждый раз, когда календарь изменяется, например, когда вы выбираете дату, когда календарь перерисовывается каждый раз.

Вы можете использовать один и тот же селектор в css3, хотя он не поддерживается в IE.

table.ui-datepicker-calendar td.ui-datepicker-week-end:nth-child(1) a 
{ 
    background: #f00; 
} 

Answer 4

Если у вас есть локальная копия файла ui.datepicker.js (пользовательский миниатюрный файл тоже будет работать) и ничего не делает с классом .ui-datepicker-week-end, вы можете его отредактировать (сделать предпочтительна копия для редактирования), так что только воскресенье назначается этому классу.

В файле ui.datepicker.js поиск «выходного дня» должен выводить два результата с помощью следующего встроенного оператора if: (t+h+6)%7>=5? Изменение значения> = 5 на == 6 будет назначать .ui-datepicker -week-end класс только по воскресеньям.

(t+h+6)%7==6?" ui-datepicker-week-end":"" 

Затем вы можете добавить CSS стиль, как вы считаете нужным для этого класса:

.ui-datepicker-week-end { 
    background: #f00; 
} 

Answer 5

$('#something').datepicker({ 
    beforeShowDay:function(date){ 
     if(date.toString().indexOf('Sun ')!=-1) 
      return [1,'red'];else 
      return [1]; 
    } 
} 

CSS:

.ui-datepicker td.red a{ 
color:#f00 !important; 
}  

Не очень красиво, но работает по мере необходимости.

Answer 6

Если вам нужно окрасить и субботу и воскресенье использовать этот CSS:

.ui-datepicker-week-end, .ui-datepicker-week-end a.ui-state-default {color: #C00;} 

Answer 7

вы можете изменить цвет воскресенье с помощью CSS

.datepicker table tr td:first-child { 
color: red 
} 

субботы цвета могут измениться, как это

.datepicker table tr td:first-child + td + td + td + td + td + td { 
color: red 
} 

, если вы не работаете с этим кодом, переходите к стилю и найдите правильный css-путь для даты datepicker a nd set выше css ot it