自动格式化日期输入

Question

具有日期输入形式的德语日期格式（dd.mm.yyyy）。

我希望用户不必键入这些点。我找到了一个英文格式（mm / dd / yyyy）的CodePen示例，在其中自动输入斜线并针对我的情况进行了更改。

在示例中，您可以从最后一个索引到第一个索引使用退格键删除。在我的版本中，我只能使用退格键删除到下一个点，然后必须将光标移到该点的左侧才能继续删除。

我做错了什么？

我曾经在美国工作的JS：

var date = document.getElementById('date');

function checkValue(str, max) {
  if (str.charAt(0) !== '0' || str == '00') {
       var num = parseInt(str);
       if (isNaN(num) || num <= 0 || num > max) num = 1;
           str = num > parseInt(max.toString().charAt(0)) && num.toString().length == 1 ? '0' + num : num.toString();
       };
       return str;
  };



date.addEventListener('input', function(e) {
  this.type = 'text';
  var input = this.value;
  if (/\D\/$/.test(input)) input = input.substr(0, input.length - 3);
  var values = input.split('/').map(function(v) {
    return v.replace(/\D/g, '')
  });
  if (values[0]) values[0] = checkValue(values[0], 12);
  if (values[1]) values[1] = checkValue(values[1], 31);
  var output = values.map(function(v, i) {
    return v.length == 2 && i < 2 ? v + ' / ' : v;
  });
  this.value = output.join('').substr(0, 14);
});


date.addEventListener('blur', function(e) {
  this.type = 'text';
  var input = this.value;
  var values = input.split('/').map(function(v, i) {
    return v.replace(/\D/g, '')
  });
  var output = '';

  if (values.length == 3) {
    var year = values[2].length !== 4 ? parseInt(values[2]) + 2000 : parseInt(values[2]);
    var month = parseInt(values[0]) - 1;
    var day = parseInt(values[1]);
    var d = new Date(year, month, day);
    if (!isNaN(d)) {
      document.getElementById('result').innerText = d.toString();
      var dates = [d.getMonth() + 1, d.getDate(), d.getFullYear()];
      output = dates.map(function(v) {
      v = v.toString();
      return v.length == 1 ? '0' + v : v;
     }).join(' / ');
    };
  };
  this.value = output;
});

这就是我修改过的内容：

 var date = document.getElementById('ContentPlaceHolder1_checkPersonDetailsView_txtGeburtsdatum_I');

                    function checkValue(str, max) {
                        if (str.charAt(0) !== '0' || str == '00') {
                            var num = parseInt(str);
                            if (isNaN(num) || num <= 0 || num > max) num = 1;
                            str = num > parseInt(max.toString().charAt(0)) && num.toString().length == 1 ? '0' + num : num.toString();
                        };
                        return str;
                    };

                    date.addEventListener('input', function (e) {
                        this.type = 'text';
                        var input = this.value;
                        if (/\D\/$/.test(input)) input = input.substr(0, input.length - 3);
                        var values = input.split('.').map(function (v) {
                            return v.replace(/\D/g, '')
                        });
                        if (values[1]) values[1] = checkValue(values[1], 12);
                        if (values[0]) values[0] = checkValue(values[0], 31);
                        var output = values.map(function (v, i) {
                            return v.length == 2 && i < 2 ? v + '.' : v;
                        });
                        this.value = output.join('').substr(0, 10);
                    });

                    date.addEventListener('blur', function (e) {
                        this.type = 'text';
                        var input = this.value;
                        var values = input.split('.').map(function (v, i) {
                            return v.replace(/\D/g, '')
                        });
                        var output = '';

                        if (values.length == 3) {
                            var year = values[2].length !== 4 ? parseInt(values[2]) + 2000 : parseInt(values[2]);
                            var month = parseInt(values[1]) - 1;
                            var day = parseInt(values[0]);
                            var d = new Date(year, month, day);
                            if (!isNaN(d)) {
                                var dates = [d.getMonth() + 1, d.getDate(), d.getFullYear()];
                                output = dates.map(function (v) {
                                    v = v.toString();
                                    return v.length == 1 ? '0' + v : v;
                                }).join('.');
                            };
                        };
                        this.value = output;
                    });    

点将在几天和几个月后自动插入。但是在退格并且光标停在该位置时不会自动删除。

你能帮忙吗？