<html>
<head>
<script>
//a:CHECKBOX集合的NAME,b:全选按钮ID,c:消选按钮的ID,d:串值的文本框ID
function selectAll(a,b,c,d){
var allObj = document.getElementsByName(a);//通过NAME得到CHECKBOX集合
for(var i=0; i<allObj.length; i++){
if(!allObj[i].checked){
allObj[i].checked = true;
}
}
var allSelObj = document.getElementById(b);//全选按钮对象
var allCanObj = document.getElementById(c);//消选按钮对象
allSelObj.checked = true;
allCanObj.checked = false;
//将选中的值存串入文本框中
var ctext = document.getElementById(d);
ctext.value = "";
for(var i=0; i<allObj.length; i++){
ctext.value += allObj[i].value+"-";
}
}
//a:CHECKBOX集合的NAME,b:全选按钮ID,c:消选按钮的ID,d:串值的文本框ID
function cancelAll(a,b,c,d){
var allObj = document.getElementsByName(a);//通过NAME得到CHECKBOX集合
for(var i=0; i<allObj.length; i++){
if(allObj[i].checked){
allObj[i].checked = false;
}
}
var allSelObj = document.getElementById(b);//全选按钮对象
var allCanObj = document.getElementById(c);//消选按钮对象
allSelObj.checked = false;
allCanObj.checked = true;
//将选中的值存串入文本框中
var ctext = document.getElementById(d);
ctext.value="";
}
//a:CHECKBOX集合的NAME,b:全选按钮ID,c:消选按钮的ID,d:串值的文本框ID
function changeOne(a,b,c,d){
var allObj = document.getElementsByName(a);//通过NAME得到CHECKBOX集合
var num = 0;//全选个个数
for(var i=0; i<allObj.length; i++){
if(allObj[i].checked){
num++;
}
}
var allSelObj = document.getElementById(b);//全选按钮对象
var allCanObj = document.getElementById(c);//消选按钮对象
if(num == allObj.length){//全选中了
allSelObj.checked = true;
allCanObj.checked = false;
}else if(num == 0){//全没选中
allSelObj.checked = false;
allCanObj.checked = true;
}else {//有选中的和没选中的
allSelObj.checked = false;
allCanObj.checked = false;
}
//将选中的值存串入文本框中
var ctext = document.getElementById(d);
ctext.value = "";
for(var i=0; i<allObj.length; i++){
if(allObj[i].checked){
ctext.value += allObj[i].value+"-";
}
}
}
</script>
</head>
<body>
全选 <input type="checkbox" id="allSelect" onclick="selectAll('abc','allSelect','allCancel','ctext')"/>
<br>
消选 <input type="checkbox" id="allCancel" onclick="cancelAll('abc','allSelect','allCancel','ctext')"/>
<br>
<input type="checkbox" id="abc1" name="abc" value="a1" onclick="changeOne('abc','allSelect','allCancel','ctext')"/> abc1
<input type="checkbox" id="abc2" name="abc" value="b1" onclick="changeOne('abc','allSelect','allCancel','ctext')"/> abc2
<input type="checkbox" id="abc3" name="abc" value="c1" onclick="changeOne('abc','allSelect','allCancel','ctext')"/> abc3
<input type="checkbox" id="abc4" name="abc" value="d1" onclick="changeOne('abc','allSelect','allCancel','ctext')"/> abc4
<input type="checkbox" id="abc5" name="abc" value="e1" onclick="changeOne('abc','allSelect','allCancel','ctext')"/> abc5
<br>
复选框值 <input type="text" id="ctext" name="checkValue" />
<input type="submit" value="提交"/>
</body>
</html>
将复选框中的值串成串存入文本框中,在将文本框中的值传到后台,在后台使用java的split()方法分解得到所选中的复选框的值
分享到:
相关推荐
2. 在列表下方放置一个“全选/全不选”复选框,当选中“全选/全不选”复选框后,列表中的所有复选框都选中,当取消“全选/全不选”复选框后,列表中的所有复选框都取消选中。 3. 当列表中的复选框都取消选中后,...
需要注意的是,在实际应用中,复选框的实现方式可能会根据项目的具体需求略有不同,但核心逻辑是相同的,即监听复选框的变化并获取选中的行数据。希望本文能够帮助到正在使用layui-table进行开发的朋友们,解决他们...
例如,在JavaScript中,你可以使用`addEventListener`来添加事件监听器,`event.target.checked`来获取复选框的当前状态,`Array.from`和`.map`来遍历和操作复选框数组。在Java Swing中,可以使用`ActionListener`...
这些jQuery操作对于处理复选框的值和状态非常实用,它们大大简化了JavaScript中的DOM操作,提高了开发效率。在实际应用中,根据需求组合使用这些方法,可以灵活地管理复选框的状态和数据。在网页交互和表单处理中,...
1. **配置zTree的多选功能**:在zTree的初始化配置中,需设置`check.enable = true`以启用复选框功能。此外,`check.chkStyle`属性通常设置为"checkbox",表示使用标准的复选框样式。同时,还可以通过`check....
然后,在JavaScript中,我们可以使用jQuery选择器找到这些checkbox,并设置它们的`checked`属性为`true`来实现默认选中。例如,如果我们希望选中值为1和3的项,可以这样操作: ```javascript var selectedValues = ...
在本文中,我们将深入探讨如何使用jQuery来操作CheckBox(复选框)元素,包括选中、取消选中和获取选中项的值。 首先,我们需要确保页面中已经引入了jQuery库。在示例代码中,通过以下方式引入了jQuery: ```html ...
35. Value 属性:该属性用于设置复选框处在什么状态,复选框控件有三种状态:0 未选定、1 选定、2 灰色。 36. Visible 属性:该属性用于设置此对象的可见性,取值为:True 可见、False 不可见。 37. ...
它允许用户从一组可选的复选框中选择一个或多个选项。然而,原生的CheckboxList控件功能有限,有时可能无法满足复杂的业务需求。为了解决这个问题,开发者们通常会对其进行扩展,增加更多的功能和灵活性。 “aspx中...