JQuery DatePicker綁定

Question

我想將日期選擇器綁定到通過json返回的日期列表並突出顯示它們。任何人都可以幫助或指出樣本？

Answer 1

您可以用beforeShowDay事件處理程序做到這一點，例如：

的JavaScript：

// Define an array of dates we want to highlight: 

var dates = [ 
    new Date("02/13/2011"), 
    new Date("02/25/2011"), 
    new Date("03/01/2011") ]; 

// Set up the datepicker: 


$("input").datepicker({ 
    beforeShowDay: function(date) { 
     // Default result has no css class: 
     var result = [true, '', null]; 
     // Determine if the date being rendered is in our array. 
     // We cannot use $.inArray because dates are reference types: 
     var matching = $.grep(dates, function(el) { 
      return el.valueOf() === date.valueOf(); 
     }); 

     if (matching.length) { 
      // Apply a class 'highlight' to dates that matched: 
      result = [true, 'highlight', null]; 
     } 
     return result; 
    } 
}); 

CSS：

table.ui-datepicker-calendar tbody td.highlight > a { 
    background: url("images/ui-bg_inset-hard_55_ffeb80_1x100.png") repeat-x scroll 50% bottom #FFEB80; 
    color: #363636; 
    border: 1px solid #FFDE2E; 
} 

這裏有一個工作示例：http://jsfiddle.net/andrewwhitaker/VEjPK/

希望有所幫助。