多日期选择器 javascript

Question

我想创建一个输入表单以允许用户在我的应用程序中添加每月定期项目。用户可以从一个月中选择多个日期。在我谷歌搜索后，我发现 AlloyUi datepicker using multiple type.

我的问题是：

如何在没有按键控制的情况下实现多个select？目前，如果在另一天不加控制地点击将删除所有其他日期。
如何在选择后将输入框更改为唯一日期，例如 return 将是 "Every 2nd, 10th, 28th every month".
还有适合我的情况的其他库吗？

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

这看起来很有希望达到您的目的。请参阅下面的演示 link：

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
});

满足您的要求：

如何在没有按键控制的情况下实现多个select？目前，如果在另一天不受控制地点击将删除所有其他日期。
如何在选择后将输入框更改为唯一日期，例如 return 将是 "Every 2nd, 10th, 28th every month"。 // 你将不得不处理它。请参阅下面的文档 link：

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

多日期选择器 javascript

Multiple date picker javascript

html

javascript

alloy-ui