你可以大胆jquery ui datepicker字段？

Question

我想知道是否有可能在jquery ui datepicker中大胆某些日期单元格。我希望用户知道他们是某些日期的事件，以便他们点击它，并向他们显示所有列出的事件。

感谢

Answer 1

可以使用beforeShowDay函数返回将被连接到当天类名。

beforeShowDay: function(date) { 
    // Check logic 
    return [true, "boldedClass"]; 
} 

Answer 2

现在需要做到这一点我的自我！感谢布兰登在功能上的领导。为了扩展它，我写了这个。它会大胆的多个日期，但我并不惊人的JavaScript，所以它是相当'快速和肮脏'。如果你有不同的日期，你需要改变数组/逻辑。毫无疑问，比较这种可怕的字符串比较的日期有很多更好的方法。

// Datepicker 
$('#datepicker').datepicker({ 
    inline: true, 
    dateFormat: 'dd-mm-yy', 
    beforeShowDay: bolddates     
}); 

function bolddates(date){ 

    var xboldthese=new Array("1-1-2012","2-1-2012","10-1-2012"); 
    var xday = date.getDate(); 
    var xmonth = date.getMonth()+1; //jan is 0 
    var xyear = date.getFullYear(); 
    var xfulldate = xday + "-" + xmonth + "-" + xyear; 
    var xcssflg = ""; 
     for (var i=0; i<xboldthese.length; i++){ 
      if(xfulldate == xboldthese[i]){ 
       xcssflg = "bolddate"; 
      }else{ 
       //maybe some other css class 
      } 
     } 
     return [true, xcssflg]; 
} 

要回答您的其他问题，只需在CSS选择器中添加a后面的内容即可。

.bolddate a{ 
    font-weight:bold !important; 
    color:#FF0000 !important; 
} 

我还在编写代码时，他们点击其中的一个。

Answer 3

好的，这里是我的另一个答案修改了一下，当你选择日期时也做点击事件。该事件由//触发器代码标记。我的一个将日期传递给一个php文件，该文件输出更新div的html，你可能是任何东西。

再次为穷人编程辩解，我只是需要这个工作。我敢肯定，它可以做得更好，效率更高。

$(function(){ 

      $('#datepicker').datepicker({ 
       inline: true, 
       dateFormat: 'd-m-yy', 
       beforeShowDay: bolddates, 
       onSelect: processdate   
      }); 

      function getdates(){ 
       return Array("1-1-2012","2-1-2012","10-1-2012","12-2-2012"); //build this however, could be a remote call 
      } 

      function parsedate(date){ 
       return date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();   
      } 

      function bolddates(date){ 
       var xboldthese=getdates(); 
       var xfulldate=parsedate(date); 
       var xcssflg = ""; 

        for (var i=0; i<xboldthese.length; i++){ 
         if(xfulldate == xboldthese[i]){ 
          xcssflg = "bolddate"; 
         }else{ 
          //maybe some other css class 
         } 
        } 
        return [true, xcssflg]; 
      } 

      function processdate(date){ 
       var xprocessthese=getdates(); 
       //note, date passed to this function is in dateFormat: option format 

        for (var i=0; i<xprocessthese.length; i++){ 
         if(date == xprocessthese[i]){ 
          //Trigger code 
          $.get('/functions/homedata.php?mode=4&date=' + date, function(data) { 
           $("#ev-eventsholder").fadeOut(1000, function(){ 
            $('#ev-eventsholder').html(data); 
           }).fadeIn(1000); });       
          } 
          //------------ 
        }    
      } 

     }); 

而简单的CSS：

  .bolddate a{ 
      font-weight:bold !important; 
      color:#FF0000 !important; 
     }