Question

我想创建一个输入表单，以允许用户在我的应用程序中添加每月重复发生的项目。用户可以从一个月中选择多个日期。谷歌搜索后，我发现 AlloyUi 日期选择器使用了多种类型。

我的问题是：

如何在没有按控制键的情况下进行多重选择？目前，如果在另一天点击无控制，则会删除所有其他日期。
如何将输入框更改为选择后的唯一日期，因此示例返回为“每月第二，十，二十八”。
还有其他适合我的情况的图书馆吗？

YUI().use(
  'aui-datepicker',
  function(Y) {
    new Y.DatePicker({
      trigger: 'textarea',
      mask: '%m/%d/%y',
      calendar: {
        selectionMode: 'multiple'
      },
      popover: {
        zIndex: 1
      },
      panes: 1
    });
  });

<link href="http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css" rel="stylesheet" />
<script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>
<textarea class="form-control" type="text" placeholder="mm/dd/yy">09/07/18 — 09/08/18 — 09/19/18</textarea>

Answer 1

对于您的目的，这看起来很有希望。参见下面的演示链接：

var today = new Date();
var y = today.getFullYear();
$('#mdp-demo').multiDatesPicker({
addDates: ['10/14/'+y, '02/19/'+y, '01/14/'+y, '11/16/'+y],
numberOfMonths: [3,4],
defaultDate: '1/1/'+y
});

它满足您的要求：

如何在没有按控制键的情况下进行多重选择？目前，如果在另一天点击无控制，则会删除所有其他日期。
如何将输入框更改为选择后的唯一日期，因此示例返回为“每月第2、10、28日”。 //您将不得不对其进行操作。请参阅下面的文档链接：

演示链接： http://dubrox.github.io/Multiple-Dates-Picker-for-jQuery-UI/#demo-full-year

多个日期选择器JavaScript

1 个答案: