我有3个单独的日期,月份和年份输入字段。
日期字段仅接受范围1-31中的值,而月字段仅接受范围1-12中的值。我想要的日期格式是dd mm yyyy。
以下是我的HTML代码,请帮我任何一个。
<div class="date">
<input id="date" name="day" />
<input id="month" name="month" />
<input id="year" name="year />
</div>
所有输入字段都是文本框。
答案 0 :(得分:1)
为自己做一点练习,希望这会有所帮助
$('#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();
});
&#13;
<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>
&#13;
参考:http://www.jquerybyexample.net/2011/12/validate-date-using-jquery.html
答案 1 :(得分:1)
检查!!我创建了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>
答案 2 :(得分:0)
您只需按以下方式使用输入框:
<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">
然后根据您的要求分开日期,月份和年份。
答案 3 :(得分:0)
尝试以下脚本:
<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>