纯 HTML 解决方案
当指定了 HTML required 属性时,用户应该在提交表单之前选择一个值。
required 属性仅适用于空值。
因此,我们必须将 <select> 元素的第一个值留空。
将 required 属性应用于 <select> 元素的示例:
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
</head>
<body>
<form action="/form/submit" method="post">
<select name="books" required>
<option value="">Books</option>
<option value="html">HTML</option>
<option value="css">CSS</option>
</select>
<input type="submit">
</form>
</body>
</html>
在下一个示例中,我们使用两个 <select> 元素,但 required 属性仅应用于第一个 <select> 元素。
使用带有和不带有 required 属性的 <select> 元素的示例:
<!DOCTYPE html>
<html>
<head>
<title>文档的标题</title>
</head>
<body>
<h2>onitroad</h2>
<form action="/form/submit" method="post">
<section>
<h3>Books</h3>
<select name="books" required>
<option value="">None</option>
<option value="html">HTML</option>
<option value="css">CSS</option>
</select>
</section>
<section>
<h3>Snippets</h3>
<select name="snippets">
<option value="">None</option>
<option value="html">HTML</option>
<option value="css">CSS</option>
</select>
</section>
<br>
<input type="submit" value="Submit">
</form>
</body>
</html>
日期:2020-06-02 22:15:13 来源:oir作者:oir
