我的代码出了什么问题,似乎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>
来源http://caniuse.com/#feat=form-验证
IE 9及以下版本不支持此功能,以下浏览器部分支持此功能:
- Safari——部分支持是指在尝试提交带有必填字段的表单时没有通知
- IE10——IE10手机中的部分支持指的是在阻止提交时缺乏警告
- OperaMini中的部分支持是指仅支持CSS伪类
简而言之,Safari不会阻止提交,即使必填字段没有填写。您需要使用JavaScript才能在Safari中获得此功能。
请首先通过在Chrome上测试来验证这是否真的是问题所在。
您忘记关闭<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>
这应该能在中工作
<!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>