如何检查用户是否从 HTML5 中的 <select> 字段中选择了某些内容？
我看到<select> 不支持新的required 属性...那我必须使用JavaScript 吗？还是我缺少什么？ ：/
【问题讨论】：
selectedIndex。
标签： javascript html select required
强制：将第一个值留空 - 要求对空值起作用
先决条件：正确的 html5 DOCTYPE 和命名输入字段
<select name="somename" required>
<option value="">Please select</option>
<option value="one">One</option>
</select>
根据the documentation（列表和粗体是我的）
必需的属性是布尔值 属性。
指定时，用户 将需要选择一个值 在提交表单之前。如果是一个选择元素
- 指定了一个必需的属性，
- 没有指定多重属性，
- 并且显示尺寸为 1（不具有 SIZE=2 或更大 - 如果不需要，请省略它）；
- 如果值 中的第一个选项元素 选择元素的选项列表（如果 any) 是空字符串（即显示为
value=""），- 还有那个 选项元素的父节点是 选择元素（而不是 optgroup 元素），
那么这个选项就是 选择元素的占位符标签 选项。
【讨论】：
根据规范，<select> 元素确实支持 required 属性：
哪个浏览器不支持这一点？
（当然，无论如何你都必须在服务器上进行验证，因为你不能保证用户会启用 JavaScript。）
【讨论】：
是的，它正在工作：
<select name="somename" required>
<option value="">Please select</option>
<option value="one">One</option>
</select>
您必须将第一个选项留空。
【讨论】：
默认情况下，您可以使用选项元素的selected 属性来选择选项。您可以对 select 元素使用 required 属性来确保用户选择了某些内容。
在Javascript中，您可以查看selectedIndex属性来获取所选选项的索引，也可以查看value属性来获取所选选项的值。
根据 HTML5 规范，selectedIndex“返回第一个选中项的索引，如果有的话，或者 -1 如果没有选中项。value”返回第一个选中项的值，如果任何，或者如果没有选定的项目，则为空字符串。”所以如果 selectedIndex = -1，那么你知道他们没有选择任何东西。
<button type="button" onclick="displaySelection()">What did I pick?</button>
<script>
function displaySelection()
{
var mySelect = document.getElementById("someSelectElement");
var mySelection = mySelect.selectedIndex;
alert(mySelection);
}
</script>
【讨论】：
-1。抱歉，我没有先在 cmets 中澄清。
需要将option的value属性设置为空字符串：
<select name="status" required>
<option selected disabled value="">what's your status?</option>
<option value="code">coding</option>
<option value="sleep">sleeping</option>
</select>
当用户在form 上按下submit 时，select 会将所选option 的value 返回到服务器。空的value 与空的text 输入相同-> 引发required 消息。
value 属性指定提交表单时要发送到服务器的值。
【讨论】：
<form action="">
<select required>
<option selected disabled value="">choose</option>
<option value="red">red</option>
<option value="yellow">yellow</option>
<option value="green">green</option>
<option value="grey">grey</option>
</select>
<input type="submit">
</form>
【讨论】：
首先您必须在第一个选项中分配空白值。 即在此处选择。仅需要即可。
【讨论】：
将选择框第一项的值设为空白。
因此，当您每次发布表单时，您都会获得空白值，并且使用这种方式您会知道用户没有从下拉列表中选择任何内容。
<select name="user_role" required>
<option value="">-Select-</option>
<option value="User">User</option>
<option value="Admin">Admin</option>
</select>
【讨论】：
试试这个，这个行得通，我试过这个，这个行得通。
<!DOCTYPE html>
<html>
<body>
<form action="#">
<select required>
<option value="">None</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
<input type="submit">
</form>
</body>
</html>
【讨论】：
如果第一个选项的值为 null，则效果很好。解释 ：HTML5 将在按钮提交时读取空值。如果不为空（值属性），则假定所选值不为空，因此验证将起作用，即通过检查选项标签中是否存在数据。因此它不会产生验证方法。但是，我猜另一面很清楚，如果 value 属性设置为 null 即 (value = "" )，HTML5 将在第一个或更确切地说是默认选择的选项上检测到一个空值，从而发出验证消息。谢谢你的提问。乐意效劳。很高兴知道我是否这样做了。
【讨论】：
在 html5 中你可以使用完整的表达式：
<select required="required">
我不知道为什么短表达式不起作用，但试试这个。 会解决的。
【讨论】：
试试这个
<select>
<option value="" style="display:none">Please select</option>
<option value="one">One</option>
</select>
【讨论】：
你也可以用 JQuery 动态地做到这一点
需要设置
$("#select1").attr('required', 'required');
删除必需的
$("#select1").removeAttr('required');
【讨论】：