Question

我的代码有什么问题，似乎required属性不起作用，即使选择了"" value的第一个选项，也可以推送提交并继续前进。这是代码：

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
  <title>Choose</title>
</head>

<body>
         <form method="post" action="page.php">
        <select name="blabla" required>
            <option value="">Choose</option>
            <?php
            foreach($blazz as $blaz){
            ?>
            <option value="<?php echo $blaz ?>"><?php echo $blaz ?></option>
            <?php
            } 
            ?>
            </select>
            <button  type='submit' name="tvt"  value="ok" class="button">Submit</button>
            </form>
</body>
</html>

Answer 1

来自http://caniuse.com/#feat=form-validation

IE 9及更低版本不支持此功能，以下浏览器部分支持此功能：

Safari - 部分支持是指在尝试提交包含必填字段的表单时缺少通知。
IE10 - IE10 mobile中的部分支持是指阻止提交时没有警告。
Opera Mini中的部分支持仅指支持CSS伪类。

简而言之，即使必填字段未填写，Safari也不会阻止提交。您需要使用JavaScript在Safari中获取此功能。

首先通过在Chrome上测试确认这是否确实是问题。

Answer 2

您忘了关闭<select>...</select>

您的代码应该是这样的：

<form method="post" action="page.php">
  <select name="blabla" required>
    <option value="">Choose</option>
    <?php
    foreach($blazz as $blaz){
    ?>
    <option value="<?php echo $blaz ?>"><?php echo $blaz ?></option>
    <?php
    } 
    ?>
  </select> <!-- This is missing -->
  <button  type='submit' name="tvt"  value="ok" class="button">Submit</button>
</form>

Answer 3

这应该有效

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Test</title>
</head>
<body>

<form action="">
  <select name="test" required>
    <option value="">Select one</option>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    <option value="5">Option 5</option>
  </select>

  <button>Submit</button>
</form>

</body>
</html>

select required在HTML / PHP中不起作用

3 个答案: