一、多选框代码
多选框是一个常见的html表单元素，它可以让用户在多个选项中进行选择。多选框的代码主要由 input 元素和 type="checkbox" 属性组成，如下所示：
<input type="checkbox" name="fruits" value="apple">苹果 <input type="checkbox" name="fruits" value="banana">香蕉 <input type="checkbox" name="fruits" value="orange">橙子
上面的代码表示一个包含三个选项的多选框，它们的 name 属性都是 fruits，value 属性分别为 apple、banana 和 orange。
二、多选框英文
多选框的英文单词是 checkbox，在html中，它经常和单选框（radio）一起使用，用来生成复杂的表单。
三、多选框标签
多选框在html中的标签是 input，它有多种类型，其中 type="checkbox" 表示它是一个多选框。
四、多选框默认全选
多选框默认状态下是全部选中的，如果需要指定哪些选项被选中，可以使用 checked 属性，如下所示：
<input type="checkbox" name="fruits" value="apple" checked>苹果 <input type="checkbox" name="fruits" value="banana">香蕉 <input type="checkbox" name="fruits" value="orange" checked>橙子
上面的代码表示苹果和橙子默认选中，香蕉默认未选中。
五、多选框的实现
多选框可以通过javascript来实现全选、取消全选等功能，具体实现方法如下：
<form>
<input type="checkbox" name="option1" value="1">选项1
<input type="checkbox" name="option2" value="2">选项2
<input type="checkbox" name="option3" value="3">选项3
<input type="button" value="全选" onclick="selectAll()">
<input type="button" value="取消全选" onclick="deselectAll()">
</form>
<script>
function selectAll() {
var checkboxes = document.getElementsByName("option");
for (var i = 0; i < checkboxes.length; i++) {
checkboxes[i].checked = true;
}
}
function deselectAll() {
var checkboxes = document.getElementsByName("option");
for (var i = 0; i < checkboxes.length; i++) {
checkboxes[i].checked = false;
}
}
</script>
六、多选框被选择事件一般用
多选框被选择事件一般使用 onchange 事件，该事件会在多选框状态改变时触发，可以通过此事件来实现特定功能，如下所示：
<form>
<input type="checkbox" name="option1" value="1" onchange="updateSelection()">选项1
<input type="checkbox" name="option2" value="2" onchange="updateSelection()">选项2
<input type="checkbox" name="option3" value="3" onchange="updateSelection()">选项3
</form>
<script>
function updateSelection() {
var checkboxes = document.getElementsByName("option");
var selection = "";
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].checked) {
selection += checkboxes[i].value + " ";
}
}
alert("当前选项为：" + selection);
}
</script>
上面的代码表示当多选框的选择状态发生改变时，会触发 updateSelection 函数，该函数会获取当前选中的选项值，并通过 alert 方法将其弹出。
七、多选框选中事件
多选框选中事件与单选按钮选中事件不同，它不能直接使用 onclick 事件，而是要使用 onchange 事件，如下所示：
<form>
<input type="checkbox" name="option1" value="1" onchange="updateSelection()">选项1
<input type="checkbox" name="option2" value="2" onchange="updateSelection()">选项2
<input type="checkbox" name="option3" value="3" onchange="updateSelection()">选项3
</form>
<script>
function updateSelection() {
var checkboxes = document.getElementsByName("option");
var selection = "";
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].checked) {
selection += checkboxes[i].value + " ";
}
}
alert("当前选项为：" + selection);
}
</script>
八、html多选按钮属性
除了 name 和 value 属性外，多选框还可以设置其他属性，如 disabled 属性表示禁用多选框，如下所示：
<input type="checkbox" name="option1" value="1" disabled>选项1 <input type="checkbox" name="option2" value="2">选项2 <input type="checkbox" name="option3" value="3" disabled>选项3
上面的代码表示选项1和选项3被禁用，无法进行选择。
九、html表单多选
多选框是html表单中常用的一种元素，它可以用来收集用户的选择信息，如下所示：
<form> <input type="checkbox" name="option1" value="1">选项1 <input type="checkbox" name="option2" value="2">选项2 <input type="checkbox" name="option3" value="3">选项3 <input type="submit" value="提交"> </form>
上面的代码表示一个包含三个选项的多选框表单，用户可以选择多个选项并提交表单。
十、html实现多选下拉框选取
如果需要在多选框中显示下拉框样式，可以使用select和option标签来实现，如下所示：
<select multiple name="fruits"> <option value="apple">苹果</option> <option value="banana">香蕉</option> <option value="orange">橙子</option> </select>
上面的代码表示一个包含三个选项的多选下拉框，在下拉框样式的列表中用户可以选择多个选项。
