javascript函数检查日期是否介于两者之间

时间:2018-03-24 19:50:00

标签: javascript

我正在尝试检查表单中输入的出生日期是否在几个日期之间,然后根据输入的出生日期填充另一个字段。我似乎无法阅读日期。

这是函数

function repeat()
{
	if(document.myform.dob1.value <='09/01/2005' && document.myform.dob1.value >='08/31/2006')
		document.myform.class1.value='Class 1';
	
	else
		document.myform.class1.value='Class 2';
}

以下是表格:

<body>
<form name="myform" method="post" action="insert_entries.php">

<table style="width: 139%" align="center">
	<tr>
		<td class="style2" style="width: 166px"><strong>FIRST NAME</strong></td>
		<td class="style2" style="width: 161px"><strong>LAST NAME</strong></td>
		<td class="style2" style="width: 66px"><strong>GENDER</strong></td>
		<td class="style2" style="width: 224px"><strong>DOB</strong></td>
		<td class="style2" style="width: 74px"><strong>CLASS</strong></td>
		<td class="style2" style="width: 104px"><strong>EVENT 1</strong></td>
		<td class="style2" style="width: 104px"><strong>EVENT 2</strong></td>
	</tr>
	<tr>
		<td style="width: 166px">
<input type="text" name="first1" size="35" style="width: 155px" /></td>
		<td style="width: 161px">
<input type="text" name="last1" size="35" style="width: 155px" /></td>
		<td style="width: 66px">
<select name="gender1" class="dropdownbox" id="series id15"style="height: 23px; width: 70px">
<option></option>
<option>M</option>
<option>F</option>
</select></td>
		<td style="width: 224px">
		<input type="date" name="dob1" size="35" onchange = "repeat()" style="width: 155px; height: 27px;" /></td>
		<td style="width: 74px">
<input type="text" name="class1" size="35" style="width: 155px" /></td>
		<td style="width: 104px">
<select name="events1" class="dropdownbox" id="series id"style="height: 23px; width: 104px">
<option></option>
</select> </td>
		<td style="width: 72px">
<select name="events1B" class="dropdownbox" id="series id16"style="height: 23px; width: 104px">
<option></option>
</select> </td>
	</tr>
</table>

无论我在该字段中的日期总是填充“Class 2”

3 个答案:

答案 0 :(得分:1)

当您尝试与字符串进行比较时,您只需要先解析日期,这样就可以了,例如:

&#13;
&#13;
var first = new Date("2018-03-01");
var second = new Date("2018-03-15");
var third = new Date("2018-03-30");

console.log(second > first && second < third); // True
// More examples
console.log(first > second); // False
console.log(first < third); // True
&#13;
&#13;
&#13;

日期甚至可以读出荒谬的帝国符号:

&#13;
&#13;
console.log(new Date('09/01/2005'))
console.log(new Date('08/31/2006'))
&#13;
&#13;
&#13;

谨防时区及所有这些。

答案 1 :(得分:0)

这似乎与以下内容重复:Compare two dates with JavaScript

您当前的比较只会比较字符串,这不是比较日期的可靠方法。

相反,您应该使用原生Date对象或尝试使用momentjs之类的库作为日期。

与MomentJS的日期比较:Moment js date time comparison

答案 2 :(得分:0)

在您的代码中,只需将您的条件置于new Date()内。意味着取代

if(document.myform.dob1.value <='09/01/2005' && document.myform.dob1.value >='08/31/2006')

if(new Date(document.myform.dob1.value) >= new Date('2005-09-01') && new Date(document.myform.dob1.value) <= new Date('2006-08-31'))

function repeat()
{
	if(new Date(document.myform.dob1.value) >= new Date('2005-09-01') && new Date(document.myform.dob1.value) <= new Date('2006-08-31'))
		console.log(1);
	else
		console.log(2);
}
<body>
<form name="myform" method="post" action="insert_entries.php">

<table style="width: 139%" align="center">
	<tr>
		<td class="style2" style="width: 166px"><strong>FIRST NAME</strong></td>
		<td class="style2" style="width: 161px"><strong>LAST NAME</strong></td>
		<td class="style2" style="width: 66px"><strong>GENDER</strong></td>
		<td class="style2" style="width: 224px"><strong>DOB</strong></td>
		<td class="style2" style="width: 74px"><strong>CLASS</strong></td>
		<td class="style2" style="width: 104px"><strong>EVENT 1</strong></td>
		<td class="style2" style="width: 104px"><strong>EVENT 2</strong></td>
	</tr>
	<tr>
		<td style="width: 166px">
<input type="text" name="first1" size="35" style="width: 155px" /></td>
		<td style="width: 161px">
<input type="text" name="last1" size="35" style="width: 155px" /></td>
		<td style="width: 66px">
<select name="gender1" class="dropdownbox" id="series id15"style="height: 23px; width: 70px">
<option></option>
<option>M</option>
<option>F</option>
</select></td>
		<td style="width: 224px">
		<input type="date" name="dob1" size="35" onchange = "repeat()" style="width: 155px; height: 27px;" /></td>
		<td style="width: 74px">
<input type="text" name="class1" size="35" style="width: 155px" /></td>
		<td style="width: 104px">
<select name="events1" class="dropdownbox" id="series id"style="height: 23px; width: 104px">
<option></option>
</select> </td>
		<td style="width: 72px">
<select name="events1B" class="dropdownbox" id="series id16"style="height: 23px; width: 104px">
<option></option>
</select> </td>
	</tr>
</table>

相关问题