jQuery UI Datepicker突出顯示了無法在Mozilla Firefox上運行的日子

Question

在重要的日子里，我在腳本中做了一些自定義。 它可以在Chrome瀏覽器上正常工作，但不能在Firefox中正常工作。 在數組中為特定日期添加了一個“突出顯示”類（請參見屏幕截圖），但是該類不是在Firefox上生成的。這個問題有解決方案嗎？

提前致謝 ！

 var dates =['05-20-2017','05-21-2017','05-22-2017','05-23-2017','05-24-2017','05-25-2017','06-01-2017','06-02-2017','06-03-2017','06-04-2017','06-05-2017','06-06-2017','06-07-2017','06-08-2017','06-09-2017','06-10-2017']; $('#datepicker44').datepicker({ minDate: 0,dateFormat: 'yy-mm-dd', //defaultDate: new Date('03/10/2017'), // this line is for testing beforeShowDay: highlightDays }); $('#datepicker44').focus(function() { this.blur(); }); function highlightDays(date) { for (var i = 0; i < dates.length; i++) { if (new Date(dates[i]).toString() == date.toString()) { return [true, 'highlight']; } } return [true, '']; } 

 td.highlight > a { background: #E50104!important; color: #fff!important; } .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #000; } 

  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <p>Date: <input type="text" id="datepicker44"> </p> 

Answer 1

這是工作代碼： https : //jsfiddle.net/bhumi/8yxmxnr7/2/

我已經更改了此條件：

if (new Date(dateSplit[0] + " " + dateSplit[1] + ", " + dateSplit[2]).toString() == date.toString()) {

還拆分日期

var dateSplit = dates[i].split("-"); 

Answer 2

您錯誤地比較了兩個字符串，而不是比較了兩個日期。 默認情況下，當您在其上使用.toString（）時，JavaScript會輸出以下內容：

Tue May 30 2017 00:00:00 GMT+0300 (EEST)

我不知道為什么它可以在Chrome中運行，但要點是您不能依靠date.toString()來保證跨瀏覽器的一致性。

相反，您必須創建兩個單獨的日期對象，並比較它們的.valueOf() ，這將是JavaScript時間戳整數。

if (Date.parse(dates[i]).valueOf() == date.valueOf()) {
   // do your thing...
}

為了使上述方法起作用，您需要傳遞Date可以理解的字符串，例如YYYY-MM-DD 。 我對Date對象正確解析的所有字符串格式及其與用戶的locale關系並不完全熟悉。

我個人使用moment.js 。 它具有更好的API，簡潔的文檔，而且我發現它非常易於使用和理解。 在大型項目中，我不再等到需要moment.js了。 我只是從一開始就添加它。 很少需要在最后清除時將其刪除，以免被使用。

Answer 3

如果您使用console.log，您會注意到Firefox記錄了“無效日期”。

某些日期格式定義不正確，瀏覽器的行為可能有所不同。 返工您的代碼以使用像iso這樣的嚴格格式： 2017-05-20

比較結果字符串也是如此。 每個瀏覽器的輸出可能不同，因此請比較各個日期/月份/年份的值。 您可以使用toDateString()或toLocaleDateString()擺脫toDateString() 。