Question

我使用了带有moment.js的bootstrap datepicker。

相同的方法适用于Chrome浏览器。在Firefox上，它显示Invalid date。

如果我将format更改为dateFormat，则可以在Firefox中使用。它将日期值更改为MM/DD/YYYY格式。但是，我需要在输入字段中显示dd-MM-YYYY格式。

请让我知道我错过的代码导致Firefox无法正常工作

这是我的javascript代码：

JS：

$('.pickerdate').datepicker({
   startDate: today,
   format: 'dd-mmm-yyyy',
   orientation: 'bottom',
   autoclose: true,
   endDate: "+1y"
});

var $returnDate = moment($('.pickerdate').val()).format('YYYYMMDDhhmm');

Answer 1

你在firefox上得到Invalid date因为你试图解析一个不是ISO 8601格式的字符串。正如时间parsing docs所说：

警告：浏览器支持解析字符串is inconsistent。因为没有关于应该支持哪种格式的规范，所以在某些浏览器中有效的功能在其他浏览器中不起作用。

要解析除ISO 8601字符串以外的任何内容的一致结果，您应该使用String + Format。

所以你必须使用moment(String, String);。在你的情况下：

moment($('.pickerdate').val(), 'DD-MM-YYYY')

无论如何请注意，您可以使用getDate方法获取datepicker的值。正如文档所述，它

返回一个本地化的日期对象，表示选择
中第一个日期选择器的内部日期对象

这是一个工作示例，演示如何使用datepicker＆＃39; s getDate以及使用格式解析的时间，从选择器获取日期（并使用您的自定义格式将其打印到控制台）。我建议使用getDate版本。

＆＃13;

var today = moment().toDate();
$('.pickerdate').datepicker({
   startDate: today,
   format: 'dd-M-yyyy',
   orientation: 'bottom',
   autoclose: true,
   endDate: "+1y"
});

$('#btn1').click(function(){
  var date = $('.pickerdate').datepicker('getDate');
  if( !date ) return;
  var $returnDate = moment(date).format('YYYYMMDDhhmm');
  console.log($returnDate);
});
$('#btn2').click(function(){
  var val = $('.pickerdate').val();
  if( !val ) return;
  var $returnDate = moment(val, 'DD-MMM-YYYY').format('YYYYMMDDhhmm');
  console.log($returnDate);
});

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet"/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>

<input type="text" class="form-control pickerdate">
<button id="btn1" type="button" class="btn btn-primary">Get date picker</button>
<button id="btn2" type="button" class="btn btn-primary">Get date moment</button>

＆＃13;

请注意，bootstrap datepicker和momentjs使用不同的格式标记。 ~~我的示例使用2位数的月份数，~~如果您需要使用缩写和完整月份名称：

M，MM bootstrap datepicker
MMM，MMMM momentjs

Bootstrap datepicker + momentJS - Firefox“无效日期”

1 个答案: