代码之家 › 专栏 › 技术社区 › Muhammad Dyas Yaskur

多日期选取器javascript

alloy-ui html javascript

0

Muhammad Dyas Yaskur · 技术社区 · 7 年前

我想创建一个输入表单,允许用户在我的应用程序中添加每月定期项目。用户可以从月份中选择多个日期。在我谷歌搜索后,我发现 埃洛伊 使用多种类型的日期选取器。

我的问题是:

如何在没有按控制的情况下进行多次选择?当前,如果在另一天单击不受控制,将删除所有其他天。
如何将输入框更改为选中后的唯一日期,因此示例返回为“每月2、10、28日”。
还有适合我的图书馆吗?

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>

1 回复 | 直到 7 年前

1

Md. Tazbir Ur Rahman Bhuiyan 7 年前

这看起来对你的目标很有希望。请参见下面的演示链接:

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