Jquery/JS 使用Input 输入生日并限制年龄

客户需求如下

CodePen程式码：https://codepen.io/shih-min-chou/pen/RwZEjGg

HTML Input

<input type="text" class="form-control" id="inputDate" placeholder="西元年月日 如:19901201"                  onkeyup = "value=value.replace(/[^0-9\-]/g,'')" inputmode="numeric" minlength="8" maxlength="8"                  onchange="checkDate(this)" pattern="(?:19|20)(?:(?:[13579][26]|[02468][048])-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-9])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:30))|(?:(?:0[13578]|1[02])-31))|(?:[0-9]{2}-(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:29|30))|(?:(?:0[13578]|1[02])-31)))"                  title="西元年月日 如:19901201" required>

中间pattern部分参考https://www.html5pattern.com/Dates
value.replace 让Input仅能输入数字及'-'符号
inputmode 让手机用户的键盘仅能输入数字
让送出时仅能输入19xx年或20xx年

<script>      function checkDate(o){        var dateVal = o.value        var dateYear = dateVal.substr(0, 4);        var dateMonth = dateVal.substr(4, 2);        var dateDay = dateVal.substr(6, 2);                function clearInput(){          o.focus();          o.value = '';        }                if (dateVal !== '' && dateVal.length == 8){          dateVal = dateYear + "-" + dateMonth + "-" + dateDay;          o.value = dateVal;          var age = getAge(dateVal);          if ( age < 20 ){            alert('年龄需满20岁以上');            clearInput();          }else if ( age > 75 ){            alert('年龄需75岁以下');            clearInput();          }        }else {          alert("请输入正确格式 西元年月日 如:19901201");          clearInput();        }      }            //抓取年龄      function getAge(dateString) {        var today = new Date();        var birthDate = new Date(dateString);        var age = today.getFullYear() - birthDate.getFullYear();        var m = today.getMonth() - birthDate.getMonth();        if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {            age--;        }        return age;      }    </script>

大概纪录一下，因为网路上几乎都只找的到使用Datepicker的方式