Question

尝试在收集和存储数据的HTML表单上节省一些时间。

对于我的日期字段，我目前正在使用日期选择器，但考虑到我输入的数据量，这是非常耗时的。

我想用执行此操作的JavaScript代码替换datepicker。

如果我输入＆＃34; 5-25＆＃34;在标签或输入字段时进入文本框会自动格式化为＆＃34; 2017-05-25＆＃34;

但是，如果月份早于当月（例如，如果它当前是5月份比1月，2月，3月或4月更早）我希望它返回当前年份加1.所以如果我输入3-26进入文本框我希望它改为2018-03-26。

有人可以帮助实现可以执行此操作的实际JavaScript代码吗？

Answer 1

我给了一个问题，并开发了一个简单的JQuery脚本来解决你的问题：

$(function() {
    //Whenever you exit any input in your form
    $("form input").on("blur", function() {

        //Get the values on each side of the dash
        var $date = $(this).val().split("-");

        //If the date is given in a wrong format
        if ($date.length != 2) {
            //Perhaps some error-handling code here
            return;
        }

        var $today = new Date();
        $year = $today.getFullYear();

        //Trailing 0 formats
        $month = ("0" + $date[0]).slice(-2);
        $day = ("0" + $date[1]).slice(-2);

        //If today is later (geater) than the given date
        if ($today > new Date($year, $month-1, $day)) {
            //Set the date format to a year later yyyy-mm-dd
            $(this).val(($year+1) + "-" + $month + "-" + $day);
        } else {
            //Set the date to this year yyyy-mm-dd
            $(this).val($year + "-" + $month + "-" + $day);
        }
    });
});
//5-10 gives 2018-05-10
//5-11 gives 2017-05-11
//4-10 gives 2018-04-10
//6-10 gives 2017-06-10
//0x-xx gives 201x-0x-xx (trailing zero can be excluded)

Answer 2

使用yyyy-mm-dd输入通常对用户来说不方便，大多数人喜欢输入d-m-y，除了某些可能更喜欢m-d-y的地方。

使用d-m-y也很有帮助，因为很容易判断部分写日期的值是什么。例如。 16/5是当年的5月16日，但如果格式是y-m-d那么我不知道5米是否应该是2005年。

无论如何，坚持使用yyyy-m-d，你可以假设，如果第一个值是4位数，则它是一年。如果它更少，那么它是一个月，然后是一天。

所以：

function setDate() {

  // Padding helper
  function z(n) {
    return (n < 10 ? '0' : '') + n
  }

  var today = new Date();
  var b = this.value.split(/\D/);
  var year = today.getFullYear();

  // If only a 2 part date was entered, create full date and
  // assume mm-dd. Otherwise do nothing
  if (b.length < 3) {
    year += b[0] <= today.getMonth()? 1 : 0;
    this.value = year + '-' + z(+b[0]) + '-' + z(+b[1])

  // For other values, make sure the separator is '-'.
  } else {
    this.value = b.map(z).join('-');
  }
}

window.onload = function() {
  var el = document.getElementById('aDate');
  if (el) {
    el.addEventListener('blur', setDate, false);
  }
};

Enter a Date:<input id="aDate" name="aDate" placeholder="yyyy-mm-dd or mm-dd">

这不做任何验证，可以添加，但应该是一个单独的功能。这个只是格式化值，然后可以验证。

我添加了一些格式，因此用户可以使用任何非数字分隔符，例如3 / 26,3.26,3-26或3 26等

在文本框中将日期格式化为yyyy-mm-dd，其中唯一的输入是mm-dd JavaScript

2 个答案: