jQuery 日期选择器对话框在任何版本的 Internet Explorer 中都不起作用

jQuery date picker dialog not working in any version of Internet Explorer

jQuery 日期选择器有一个奇怪的问题。在 Chrome、FF 中工作正常,但在 Internet Explorer 中,它的呈现方式与附图中的一样,甚至是 IE 11,正如您在没有日历的情况下看到的那样。

像这样呈现时没有控制台错误,我正在初始化:

$('.customDateInput').each(function (idx) {
     var $this = $(this);
     var defaultDate = $this.attr("value").replace(/-/g, ",");
     var $datepicker = $this.parent().find(".datepicker");
     var $spanElement = $this.parent().find(".datepicker-button span");
     (function (picker, altField, defaultDate, spanElement) {
          picker.datepicker({
               yearRange: "c-75:c+10",
               firstDay: 1,
               dateFormat: 'D, d M yy',
               changeMonth: true,
               changeYear: true,
               altField: altField,
               altFormat: 'yy-mm-dd',
               defaultDate: new Date(defaultDate),
               onClose: function(dateText, inst) {
                   if (dateText) {       
                        spanElement.html('<strong>'+dateText+'</strong>');
                   }
               }
          });
      })($datepicker, $this, defaultDate, $spanElement);
});

$('.datepicker-button').click(function(){
        $(this).parent().find(".datepicker").datepicker('show');
});

只是在寻找有关如何调试它的提示!

好吧,我终于弄明白了,问题在于传递默认日期,因为 IE 中的以下警告会破坏日历。

假设 defaultDate 保存日期为“2014,12,18”或无日期:

  • new Date('') // NaN <- Chrome returns 无效日期,不破坏日历
  • new Date('2014,12,18') // NaN <- Chrome returns 'Thu Dec 18 2014'
  • new Date(null) // 1 月 1 日星期四 00:00:00 UTC 1970
  • new Date(undefined) // NaN
  • new Date(2014,12,18) // 1 月 18 日星期日(因为 JS 认为月份是 0-11)

解决方案是使用其中一个作为新的 Date() 参数:

  • new Date() // 预期的当前日期
  • new Date(2014, 11, 18) // 2014 年 12 月 18 日如预期

-

$('.customDateInput').each(function (idx) {
    var $this = $(this);
    var defaultDate = $this.attr("value").replace(/-/g, ",");
    var $datepicker = $this.parent().find(".datepicker");
    var $spanElement = $this.parent().find(".datepicker-button span");
    (function (picker, altField, defaultDate, spanElement) {

      /** Solution to issue **/
      if(defaultDate) {
          defaultDate = defaultDate.split(',');
          defaultDate = new Date(defaultDate[0], defaultDate[1] - 1, defaultDate[2]);
      } else {
          defaultDate = null;
      }
      /** End of solution **/

      picker.datepicker({
           yearRange: "c-75:c+10",
           firstDay: 1,
           dateFormat: 'D, d M yy',
           changeMonth: true,
           changeYear: true,
           altField: altField,
           altFormat: 'yy-mm-dd',
           defaultDate: new Date(defaultDate),
           onClose: function(dateText, inst) {
               if (dateText) {       
                    spanElement.html('<strong>'+dateText+'</strong>');
               }
           }
      });
   })($datepicker, $this, defaultDate, $spanElement);
});

$('.datepicker-button').click(function(){
    $(this).parent().find(".datepicker").datepicker('show');
});