在PHP和JS下，checkbox框的值该如何正确获取？

最新推荐文章于 2021-03-24 19:47:21 发布

最新推荐文章于 2021-03-24 19:47:21 发布 · 237 阅读

文章标签：

#PHP #HTML

javascript 专栏收录该内容

32 篇文章

订阅专栏

本文通过一个简单的示例对比了PHP和JavaScript在处理HTML表单复选框时的不同方式。在PHP中，只有当用户选中复选框时，$_POST才能获取其值；而在JavaScript中，无论是否选中，都能通过document.getElementById获取value属性值。

先看代码：

<?php
if ($_POST) {
	var_dump($_POST);
}
?>
<html>
<head>
</head>
<body>
<form id="myform" action='' method='post' name='Users_form' > 
<input type="checkbox" id="accept" name="accept" value="1"/><label for="accept">这是一个复选框</label>
<br>
<input type="button" name="js_btn" value="查看JS下的值" onclick="foo();">
<input type="submit" name="php_btn" value="查看PHP下的值">
</form>
</body>
</html>
<script>
  function foo(){
    var obj = document.getElementById('accept');
    if(obj.checked) {
      alert(obj.value);
    } else {
      alert('未选中');
    }
  }
</script>

在PHP，当用户选中复选框，$_POST才能获取到它的值；当用户未选中的时候，$_POST将没有 $_POST['accept']。

在JS，无论用户是否选中，document.getElementById('accept').value将始终返回value里的值。把属性checked作为复选框是否选中的条件，才能准确地获取。

强调

请尽量保持input的id和name成对出现，PHP获取post的键是根据name的，而js依赖id更方便一些。

单选的input同上。

相关链接：《select、input-checkbox标签的多值处理》