<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
</style>
<title>JS获取复选框被选中的值</title>
</head>
<body>
<input type="checkbox" name="aihao" value="0" />0
<input type="checkbox" name="aihao" value="1" />1
<input type="checkbox" name="aihao" value="2" />2
<input type="checkbox" name="aihao" value="3" />3
<input type="checkbox" name="aihao" value="4" />4
<input type="checkbox" name="aihao" value="5" />5
<input type="checkbox" name="aihao" value="6" />6
<input type="checkbox" name="aihao" value="7" />7
<input type="button" onclick="chk()" value="提 交" />
</body>
</html> 总共有八个checkbox和一个按钮，点击“提交”按钮后可以知道当前所选中的复选框的value值，下面是JS代码，
<script src="jquery.js"></script><!--这是载入jquery.js文件，如果不使用jquery可以去掉-->
<script>
function chk(){
var obj=document.getElementsByName('aihao'); //选择所有name="aihao"的对象，返回数组
//取到对象数组后，我们来循环检测它是不是被选中
var s='';
for(var i=0; i<obj.length; i++){
if(obj[i].checked) s+=obj[i].value+','; //如果选中，将value添加到变量s中
}
//那么现在来检测s的值就知道选中的复选框的值了
alert(s==''?'你还没有选择任何内容！':s);
}
function jqchk(){ //jquery获取复选框值
var s='';
$('input[name="aihao"]:checked').each(function(){
s+=$(this).val()+',';
});
alert(s==''?'你还没有选择任何内容！':s);
}
</script> 点击“提交”后，可以得到正确的选择值了，但是后面多一个,(英文逗号)，这个可以检测一下再用substring去除，或者获取到复选框选择值后一般都要转成数组再使用的，所以也可以在转成数组后，去除最后一个数组元素。
取得checkbox的值以及给数组转换成字符串
var xzid=$("input[name=clid]:checked");
var arr=new Array();
if(xzid!=undefined){
for(var a=0;a<xzid.length;a++){
arr.push($(xzid[a]).val());
}
}
alert(arr.join(","));
分享到：
相关推荐
// 其他自定义绘制操作 } ``` 3. **处理鼠标事件**： 为了使自定义的`Checkbox`具有交互性，我们还需要处理鼠标点击事件。重写`OnMouseClick`方法，根据鼠标的点击位置判断是否改变了选中状态。 ```csharp ...
在网页设计和开发中，复选框（Checkbox）是一种常见的用户界面元素，允许用户从多个选项中选择一个或多个。当涉及到数据提交，比如通过HTML表单POST方法将用户的选择发送到服务器并存储到数据库中时，理解如何处理复...
为了增加用户交互性，我们经常会在ListView的每一项中添加CheckBox，这样用户就可以进行多选操作。本篇文章将详细讲解如何在ListView中实现CheckBox复选框的功能。 首先，我们需要创建一个自定义的ListView适配器。...
在Windows Forms（WinForm）开发中，CheckBox控件是一个基础且重要的元素，用于实现用户界面中的复选框功能。在.NET 2.0版本和Visual Studio 2005（VS2005）环境下，开发者可以利用丰富的特性来定制和美化这些控件，...
在编程领域，`Checkbox`（复选框）是一种常见的用户界面元素，用于让用户在多个选项中选择一个或多个。在本教程中，我们将探讨如何在不同的编程语言和框架中实现复选框的功能，以及如何处理与之相关的事件，如点击...
此外，为了优化用户体验，我们还可以添加一些辅助功能，比如禁用父级复选框的选中状态，直到所有子级复选框的状态都已知，或者在选中/取消选中父级复选框时，提供批量操作的动画效果。 在实际项目中，我们可能会...
### 隐藏LayUI数据表格表头的Checkbox复选框方法详解 #### 背景介绍 在前端开发过程中，经常会使用到LayUI框架搭建网页应用，尤其是在设计复杂的数据展示界面时，LayUI提供了强大的数据表格功能。然而，在某些场景...
"CheckBox"，即复选框，是用户界面中常见的一种交互元素，用于让用户进行多选操作。在默认状态下，复选框通常显示为一个简单的矩形方框，内含一个勾选标记或空白，样式相对朴素。然而，为了提供更具吸引力和品牌特色...
在Android开发中，多选框（CheckBox）是一个不可或缺的用户界面元素，它允许用户在多个选项中进行选择，常用于设置界面或筛选功能。本文将深入探讨如何在Android应用中使用Checkbox，包括其基本用法、监听事件以及...
【CheckBoxList的操作】知识点详解 CheckBoxList是Windows Forms控件，用于显示一组可选的复选框，用户可以选择其中的一项或多项。以下是关于CheckBoxList的一些关键操作和常见用途的详细说明： 1. **添加项**：你...
在IT行业中，实现“checkbox鼠标拖拽框选”功能是一项常见的交互设计，它极大地提高了用户在操作大量复选框时的效率。这个功能通常应用于文件管理器、数据筛选或者自定义设置等场景，让用户能够通过鼠标拖动快速选择...
在本文中，我们将深入探讨如何使用jQuery和layui插件来创建功能丰富的checkbox复选框，包括权限范围的多选、单选以及全选操作。同时，我们也将关注于父级和子级复选框之间的联动关系，即父级选中时子级全部选中，而...
复选框（CheckBox）是用户界面中常见的一种元素，用于让用户在多个选项中进行多选操作。在标准的HTML和CSS中，复选框的样式有限，往往难以满足设计师们对于个性化和品牌一致性的追求。这个美化版的CheckBox旨在提供...
在本文中，我们将深入探讨如何在layui框架中创建一个表格，其中某一列显示为复选框（checkbox），以便实现单选功能。layui是一款基于前端的轻量级组件库，提供了丰富的UI组件，包括表格（table）、按钮、表单元素等...
本项目名为“jquery模拟div多选checkbox下拉框”，其核心目标是使用jQuery来实现一个功能丰富的多选下拉框替代传统的HTML `<select>` 元素，通过使用`<div>`元素和复选框（checkbox）来提供更自定义化的用户体验。...
5. **DOM操作**：JavaScript允许我们轻松地操作DOM元素，如创建、删除、修改和查找节点，这对于构建动态的树形结构至关重要。 CSS在这项任务中的角色主要是负责样式设计，包括： 1. **布局**：使用CSS的盒模型和...
在这个特定的场景中，我们讨论的是如何在用户点击checkbox之前弹出一个确认对话框，以增加用户操作的确认环节，避免误操作。这种功能常见于需要用户谨慎操作的场合，比如删除文件或执行不可逆的操作。 首先，我们...
Jquery操作CheckBox多选框.doc
在IT领域，Checkbox（复选框）是一种常见的用户界面元素，广泛应用于网页、桌面应用程序以及移动应用中。Checkbox允许用户从多个选项中选择一个或多个，以表达他们的选择或者设置状态。本示例将深入探讨Checkbox的...
本文将深入探讨“11种炫酷CSS3复选框checkbox样式美化效果”这一主题，以及如何利用这些效果提升用户体验。 首先，我们要明白CSS3中的复选框（checkbox）是HTML中的一种表单元素，用于让用户做出选择。默认情况下，...