如何验证日期、月份和日期的3个独立输入字段;年使用jquery或javascript

只是我自己的一点练习，希望这能有所帮助

$('#submit').click(function(){
  var date = parseInt($('#date').val());
  var month = parseInt($('#month').val());
  var year = parseInt($('#year').val());
  if (isNaN(date) || isNaN(month) || isNaN(year)) {
    alert('wrong format');
    return false;
  } else {
    if (date > 31 || date < 1) {
      alert('wrong date');
      return false;
    } else if ((month==4 || month==6 || month==9 || month==11) && date ==31) {
      alert('wrong date');
      return false;
    } else if (month==2) {
     var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
      if (date> 29 || (date ==29 && !isleap))
      	alert('wrong date');
        return false;
    }
    if (month > 12 || month < 1) {
      alert('wrong month');
      return false;
    } 
    if (year > 2050 || year < 1900) {
      alert('wrong year');
      return false;
    } 
  }
  $('#myform').submit();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form action="" id="myform" method="POST">
<label for="date">Date</label>
<input type="text" id="date" name="date" />
<label for="month">Month</label>
<input type="text" id="month" name="month" />
<label for="year">Year</label>
<input type="text" id="year" name="year" />
<input id="submit" type="submit" value="Submit">
</form>

参考：http://www.jquerybyexample.net/2011/12/validate-date-using-jquery.html

尝试以下脚本：

  <script>
    function validateForm() {
        var d = document.forms["myForm"]["date"].value;
        var m = document.forms["myForm"]["month"].value;
        var y = document.forms["myForm"]["year"].value;
        if(d == null || d == ""){
            alert("Please select date.");
            return false;
        }
        if(m == null || m == ""){
            alert("Please select date.");
            return false;
        }
        if(y == null || y == ""){
            alert("Please select date.");
            return false;
        }
        if((m == 4 || m == 6 || m == 9 || m == 11) && d == 31) {
            alert("Selected month contains only 30 days.");
            return false;
        }
        if(m == 2 && d > 29 && (y%4 == 0)) {
            alert("Selected month contains only 29 days.");
            return false;
        }
        if((m == 2) && d > 28) {
            alert("Selected month contains only 28 days.");
            return false;
        }
        return true;
    }
</script>

形式为：

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post"> 
<input type="number" id="d" name="date" min="1" max="31" />
<input type="number" id="m" name="month" min="1" max="12" />
<input type="number" id="y"  name="year" min="1900" max="9999" />
<input type="submit" value="Submit">
</form>

检查一下！！我创建了3个文本字段，用于年月日，并通过javascript进行验证。

        <script type="text/javascript">
            function dateChecker()
            {
            var dayValidate = "([1-9]|[12]'d|3[01])";
            var monthValidate = "^(0?[1-9]|1[012])$";
            var yearValidate = "/^(19[5-9]d|20[0-4]d|2050)$/";
            var days = document.getElementById('dayId').value;
            var months = document.getElementById('monthId').value;
            var years = document.getElementById('yearID').value;
            if (!days.match(dayValidate))
            {
                alert("Please, Enter Days  between 1 to 31 ");
                document.form1.dayId.focus();
                return false;
            }
            if (!months.match(monthValidate))
            {
                alert("Please, Enter Months in between 1 to 12 ");
                document.form1.monthId.focus();
                return false;
            }
            if (!(+years >= 1900 && +years <= 2016))
            {
                alert("Please, Enter Years in between 1900 to 2016 ");
                document.form1.yearID.focus();
                return false;
            }
        }

       </script>
       <form name="form1">
        <table>
            <tr>
                <td>
                    <input type="text"  id="dayId"/> 
                </td>
                <td>
                    <input type="text"  id="monthId"/> 
                </td>
                <td>
                    <input type="text"  id="yearID"/> 
                </td>
            </tr>
            <tr>
                <td>
                    <input type="submit" onclick="returndateChecker();"/>
                </td>
            </tr>
        </table>
    </form>

只需按照以下方式使用输入框：

<input type="number" name="date" min="1" max="31" />
<input type="number" name="month" min="1" max="12" />
<input type="number" name="year" min="1900" max="9999" />

最好使用日期字段：

<input type="date" name="date" id="date">

然后根据您的要求将日期、月份和年份分开。