2

我花了一周的时间试图让一个多选日期选择器工作。在我尝试过的所有组件中,multiDatesPicker 符合要求,但我无法让它工作。我什至下载了他们在示例中使用的两个包含的 jquery .js 文件的相同版本。请有人可以帮助我,我必须在月底之前完成这项工作。

下面是下载的示例代码

<html>
<head>
<!-- includes jquery, jquery ui and multidatespicker scripts -->
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.4.custom.min.js"></script>
<script type="text/javascript" src="jquery.ui.multidatespicker.js"></script>

<script>
  $(function() {
    // initiate the multiDatesPicker.
    // Note that you can still use jQuery UI datepicker options (and events and methods too :)
    $('#calendar').multiDatesPicker({
      minDate: +1, // jQuery UI datepicker option
      addDates: ['26/09/2010', '01/12/2010'] // multidatepicker option
    });

    // shows selected dates in an alert message
    $('#show_dates').click(function(e) {
      e.preventDefault();
      var dates = $('#calendar').multiDatesPicker('getDates');
      var dates_in_string = '';
      for(d in dates) dates_in_string+= dates[d]+' ';
      alert(dates_in_string);
    });
  });
</script>
</head>
<body>
  <div id="calendar"></div>
  <button id="show_dates">Show selected dates!</button>
</body>
</html>

我已经检查了所有三个 .js 文件加载正常。

4

1 回答 1

1

您面临的错误是因为该addDates选项取决于本地化:

添加以字符串、毫秒或 javascript 日期对象格式指定的日期数组。
注意:您应该传递给 multiDatePicker 的字符串格式取决于 datepicker 的本地化,有关如何配置它的更多信息,请参阅此页面。

如果您检查控制台,则会出现 jQuery-UI 脚本引发的错误:

未捕获的无效日期

如果您没有找到日期选择器,它使用 US/ENG 表示法;所以你的日期必须设置为:

$('#calendar').multiDatesPicker({
    minDate: +1, // jQuery UI datepicker option
    addDates: ['09/26/2010', '12/01/2010'] // multidatepicker option
});

工作演示:jsFiddle

如果要设置不同的日期格式,请使用以下dateFormat选项:

$('#calendar').multiDatesPicker({
    minDate: +1, // jQuery UI datepicker option
    dateFormat: "dd/mm/yy",   
    addDates: ['26/09/2010', '01/12/2010'] // multidatepicker option
});

工作演示:jsFiddle

PS:如果可以,请更新您的 jQuery 版本

于 2013-07-22T10:10:45.453 回答