选择带值的输入时需要答案

【问题标题】：required in select input with value选择带值的输入时需要
【发布时间】：2018-09-14 23:26:06
【问题描述】：

我有代码

<!DOCTYPE html>
<html>
<body>

<form action="/action_page.php">
<select required>
  <option value=1>Volvo</option>
  <option value=2>Saab</option>
  <option value=3>Mercedes</option>
  <option value=4>Audi</option>
  <option value=5 selected>None</option>
</select>
<input type="submit">
</form>

</body>
</html>

none 是默认值，选择值为 5，当用户选择 none 时，是否仍有必填信息？怎么解决，谢谢

【问题讨论】：

为什么不为 None 选项保留 value=''？
试试这个：stackoverflow.com/questions/14299017/…
“当用户选择 none 时，是否仍然存在必需的消息？” - 不，因为它是一个有效的选择。 “纯 HTML”中的唯一方法是使其成为适当的占位符选项，w3.org/TR/html5/sec-forms.html#the-select-element：“如果选择元素指定了必需的属性，没有指定多个属性，并且显示大小为1个；如果选择元素的选项列表（如果有）中的第一个选项元素的值是空字符串 [...]，则该选项是选择元素的占位符标签选项。”
这里没有php，为什么要给它打标签？

标签： php html

【解决方案1】：

这是一个会显示警告的 php 选项。

<?php

if(isset($_POST['check']) && $_POST){

  if($_POST['car'] == 5){

    echo 'You must select a value.';

  }

}

?>

<!DOCTYPE html>
<html>
<body>

<form action="" method="post" enctype="multipart/form-data">
<select id="car" name="car" required>
  <option value=1>Volvo</option>
  <option value=2>Saab</option>
  <option value=3>Mercedes</option>
  <option value=4>Audi</option>
  <option value=5 selected>None</option>
</select>
<input type="submit" name="check" value="Submit">
</form>

</body>
</html>

这是许多可能的 js 解决方案之一：

<script>

    function checkSelect(){

        if(document.getElementById('car').value == 5){

          alert('You must select a car.');

        }

    }


</script>

<!DOCTYPE html>
<html>
<body>


<form action="" method="post" enctype="multipart/form-data" onsubmit="checkSelect()">
<select id="car" name="car" required>
  <option value=1>Volvo</option>
  <option value=2>Saab</option>
  <option value=3>Mercedes</option>
  <option value=4>Audi</option>
  <option value=5 selected>None</option>
</select>

<input type="submit" name="check" value="Submit" onSubmit>
</form>

</body>
</html>

我也会考虑使用类似 jQuery Validation 插件的东西，它是一个表单验证器。让事情变得容易多了。 https://jqueryvalidation.org/

【讨论】：

【解决方案2】：

您可以像这样将 Value Empty 保留为 None 选项：

<!DOCTYPE html>
<html>
<body>

<form action="" method="post">
<select id="select" required>
<option value="">None</option> 
<option value="option1">Option1</option>
<option value="option2">Option2</option>
<option value="option3">Option3</option>
</select>
<input type="submit" name="check" value="Submit">
</form>

</body>
</html>

【讨论】：