javascript - Jquery datepicker 输入普通文本和日期

Question

如何使用 jquery datepicker 从图标输入日期并从键盘获取随机文本。

例如
我需要一个文本框来获取确切日期(2015 年 10 月 26 日)以及 3 年来的文本。

提前致谢。

Answer 1

您可以使用隐藏输入作为具有这种逻辑的日期选择器，例如:

$(function() {
  $(".date").datepicker({
    dateFormat: 'dd/mm/yy',
    showOn: "button",
    buttonImage: "https://htmlcssphptutorial.files.wordpress.com/2015/09/b_calendar.png",
    buttonImageOnly: true,
    buttonText: "Select date",
    onSelect: function(dateText) {
      $(this).prev().val(dateText);
    }
  });
  $('input + .date').prev().on('change', function() {
    var dateStr = this.value.split(/[\/-]/);
     $(this).next().datepicker("setDate", new Date(dateStr[2], dateStr[1] - 1, dateStr[0]) );
  })
});

.date {
  display: none;
}

<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<input placeholder="Any text there" />
<input type="text" name="date" class="date" readonly />