突出顯示自定義的日期

我想強調一些自定義的日期：這是我迄今爲止突出顯示自定義的日期

if (jQuery('.datepicker').length) { 
     jQuery('.datepicker').each(function (i) { 
      var $item = jQuery(this); 
      var fechas = $item.data('fechas');    
      var options = { 
       'display' : $item.data('display') == '' ? '' : $item.data('display'), 
       beforeShowDay: function(date) { 
        console.log(date); 
        if (fechas.length) { 
         for(var i = 0; i < fechas.length; i++) { 
          if (fechas[i] == date) { 
           return [true, 'css-class-to-highlight', 'tooltipText']; 
          } 
         } 
        } 
       } 
      } 
      $item.datepicker(options); 
     }); 
    }

但後來我得到這個錯誤

Uncaught TypeError: Cannot read property '0' of undefined

http://jsfiddle.net/34jLb8o3/2/

的事情是我想強調這個日期，無論當前的日期，我已經看到像this one這樣的答案，但我不認爲他們適用於這裏，是嗎？

來源

2014-10-10 Toni Michel Caubet

這似乎更好的工作：http://jsfiddle.net/34jLb8o3/8/

jQuery(function(){ 
    jQuery('.datepicker').each(function (i) { 
       var $item = jQuery(this); 
       var fechas = $item.data('fechas');    
       var options = { 
        'dateFormat' : 'dd/mm/yy', 
        'display' : $item.data('display') == '' ? '' : $item.data('display'), 
        beforeShowDay: function(date) { 
         if (fechas.length) { 
          var datestr = [ date.getDate(), date.getMonth()+1, date.getFullYear()]; 
          datestr = datestr.join('/'); 
          console.log(datestr); 
          if ($.inArray(datestr, fechas) != -1) {          
           return [true, 'css-class-to-highlight', 'tooltipText']; 
          } else { 
           return [false, 'css-normal-class', 'no-highlight']; 
          } 
         } 
        } 
       } 
       $item.datepicker(options); 
      }); 
});

來源

2014-10-10 09:17:45 DarkMukke

您好，感謝您的回答，我適應我的代碼到一個你ansewr，但我給出的錯誤，任何想法？ – 2014-10-10 09:41:36

更改dmy答案 – DarkMukke 2014-10-10 09:43:55

實際上，它是可見的;我可以根據示例代碼記錄每個'fechas [i]' – 2014-10-10 09:45:04

這裏的查詢語句，突出2014年10月

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>  
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script> 
    <style> 
     .ui-state-highlight { 
     background: red !important;  
    } 

    </style> 
    <script type="text/javascript"> 
     $(function() { 
      $("#date").datepicker(); 
      $("#date").bind('click', function() { highLightDate(2014, 9, 31); }); 

     }) 

     function highLightDate (_year,_month,_day){ 
      $('[data-year=' + _year + '][data-month=' + _month + '] > a:contains(' + _day + ')') 
       .filter(function (index) {     
        return $(this).text() == _day; 
       }) 
       .addClass('ui-state-highlight'); 
     } 
    </script> 

</head> 
<body> 
    <input type="text" width="100" id="date" /> 
</body> 
</html>

之日起2次嘗試這個代碼，它在我結束工作完全。希望這能解決你的問題。

來源

2014-10-10 09:44:05 Abhishek

因爲這一點2.我不能使用這個解決方案....謝謝！ – 2014-10-10 09:51:18

檢查編輯的答案。你現在可以非常安靜地使用它。 – Abhishek 2014-10-10 09:58:46

讓我看看;） – 2014-10-10 10:03:27

您可以使用beforeShowDay，返回數組作爲每docs

http://jsbin.com/borum/2/edit?js,output

$(function() { 
    var dates = ["10/10/2014","12/10/2014","13/10/2014"];    
    var options = { 
     dateFormat : 'dd/mm/yy', 
     beforeShowDay: function(date) { 
     formattedDate = $.datepicker.formatDate('dd/mm/yy', date); 
     if(dates.indexOf(formattedDate) === -1){ 
      return [false]; 
     } 
     else{ 
      return [true]; 
     } 
     } 
    }; 
    $("#datepicker").datepicker(options); 

});

來源

2014-10-10 10:20:47

突出顯示自定義的日期

回答

相關問題