我正在为课堂上的任务制作表格,没有人能弄清楚为什么输入验证不起作用。整个表单的代码如下。特别是必需标签似乎造成了问题。
<form action = "">
<p>First Name</p>
<input type = "text" name = "firstname" size = "25" maxlength = "20"></input> <br>
<p>Last Name</p>
<input type = "text" name = "lastname" size = "25" maxlength = "20"></input> <br>
<p>Age</p>
<input type = "radio" name = "age" value = "<25" checked></input><25
<input type = "radio" name = "age" value = "25-40" ></input>25-40
<input type = "radio" name = "age" value = ">40" ></input>>40
<input type = "radio" name = "age" value = "Rather not say" ></input>Rather not say <br>
<div style = "float:left">
<p>Favourite food</p>
<select name = "Favourite food" style = "float:left;">
<option value = "1" selected>Italian</option>
<option value = "2">Indian</option>
<option value = "3">Thai</option>
<option value = "4">Chinese</option>
</select>
</div>
<br>
<div style = "float:right">
<p>What new country would you like to see on the website?</p>
<select name = "newCountry">
<option value = "1" selected>Vietnamese</option>
<option value = "2">American</option>
<option value = "3">French</option>
<option value = "4">Spanish</option>
</select>
</div>
<br>
<p style = "clear:both; float:left;">What new cooking technique would you like to see on the website?</p>
<textarea name = "NewTechnique" rows = "5" cols = "100" maxlength = "500" style = "clear:both;"> </textarea>
<br>
<p>Please rate the following from 1 (poor) to 5 (excellent)</p>
<p>Ease of use</p>
<input type = "text" name = "easeofuse" size = "25" min = "1" max = "5" required=""></input> <br>
<p>Quality of information</p>
<input type = "text" name = "infoquality" size = "25" min = "1" max = "5" required></input> <br>
<p>Taste of recipies</p>
<input type = "text" name = "tastes" size = "25" min = "1" max = "5" required = ""></input> <br>
<p>Permission for my information to be held and used for future developments</p>
<input type ="radio" name = "permission" value = "1" required></input>Yes
<input type ="radio" name = "permission" value = "2"></input>No
<input type = "submit" onclick="alert('form entered')" value = "submit"></input>
</form>
我看不出问题是什么。是因为action标签为空?我们被告知要这样离开。
编辑:问题已解决!
答案 0 :(得分:-1)
为了使表单required
的字段起作用,我在onclick
标记内将onsubmit
替换为form
。我还清理了一下快速浏览后发现的所有HTML怪异现象(我可能错过了一些)。
<form onsubmit='alert("ya done clicked")'>
<p>First Name</p>
<input type="text" name="firstname" size="25" maxlength="20"> <br>
<p>Last Name</p>
<input type="text" name="lastname" size="25" maxlength="20"> <br>
<p>Age</p>
<input type="radio" name="age" value="<25" checked><25
<input type="radio" name="age" value="25-40">25-40
<input type="radio" name="age" value=">40">>40
<input type="radio" name="age" value="Rather not say">Rather not say <br>
<div style="float:left">
<p>Favourite food</p>
<select name="Favourite food" style="float:left;">
<option value="1" selected>Italian</option>
<option value="2">Indian</option>
<option value="3">Thai</option>
<option value="4">Chinese</option>
</select>
</div>
<br>
<div style="float:right">
<p>What new country would you like to see on the website?</p>
<select name="newCountry">
<option value="1" selected>Vietnamese</option>
<option value="2">American</option>
<option value="3">French</option>
<option value="4">Spanish</option>
</select>
</div>
<br>
<p style="clear:both; float:left;">What new cooking technique would you like to see on the website?</p>
<textarea name="NewTechnique" rows="5" cols="100" maxlength="500" style="clear:both;"> </textarea>
<br>
<p>Please rate the following from 1 (poor) to 5 (excellent)</p>
<p>Ease of use</p>
<input type="text" name="easeofuse" size="25" min="1" max="5" required> <br>
<p>Quality of information</p>
<input type="text" name="infoquality" size="25" min="1" max="5" required> <br>
<p>Taste of recipies</p>
<input type="text" name="tastes" size="25" min="1" max="5" required> <br>
<p>Permission for my information to be held and used for future developments</p>
<input type="radio" name="permission" value="1" required>Yes
<input type="radio" name="permission" value="2">No
<input type="submit" value="submit">
</form>