需要从下拉 html 5 中进行选择
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12938701/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Requiring to make a selection from a drop down html 5
提问by Austin Lovell
Is it possible to force/require a user to make a selection from a drop down menu? Example:
是否可以强制/要求用户从下拉菜单中进行选择？例子：
<form action="">
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>
By default "Volvo" is selected. What I want is for the browser to know that the user has made a selection and not accept the auto default.
默认情况下选择“沃尔沃”。我想要的是让浏览器知道用户已经做出选择并且不接受自动默认值。
I am thinking something like this:
我在想这样的事情：
<form action="">
<select name="cars" required="required">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>
Any advice?
有什么建议吗？
采纳答案by Thomas
A lot of time has passed since the question was posted. For anybody stumbling over this like I did, the solution became a lot simpler by now: You can just add a first option to the selection, with no value set. The browser will automatically treat this like "nothing was selected":
自问题发布以来已经过去了很多时间。对于像我一样遇到这个问题的人，现在解决方案变得简单得多：您可以只在选择中添加第一个选项，不设置任何值。浏览器会自动将其视为“未选择任何内容”：
<!DOCTYPE html>
<html>
<body>
<form>
<select required>
<option value="">Please select</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
<input type="submit"/>
</form>
</body>
</html>
JSFiddle showing it work with no further JS required: https://jsfiddle.net/nrs5a7qh/
JSFiddle 显示它无需进一步的 JS 即可工作：https://jsfiddle.net/nrs5a7qh/
回答by zmanc
I tweaked an example from jquery validate to get this working for you. I know in your original question you asked for it to be based in HTML5 but maybe this blended example is acceptable.
我调整了 jquery validate 中的一个例子来让它为你工作。我知道在您最初的问题中，您要求它基于 HTML5，但也许这个混合示例是可以接受的。
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<script>
$(document).ready(function(){
$("#carsForm").validate();
});
</script>
</head>
<body>
<form class="cmxform" id="carsForm" method="get" action="">
<select name="cars" class="required">
<option value="">Select a car</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</form>
?Original Example was on http://docs.jquery.com/Plugins/Validation
