chebox全选 取消全选
来源：互联网 发布：java代码utf8转换为gbk 编辑：程序博客网 时间：2024/04/29 17:58
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> checkbox全选与取消Demo 2011-08-16 </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="JavaScript">
<!--
/*
* 全选框checkbox控件事件
* eg：调用方法 <input type="checkbox" name="AllItem" id="allItem" onclick="chkAllItems(this.checked,'subItem');">全选
* @flag 全选checkbox控件的状态
*
* @subItem 子选项checkbox的name的名称
*/
function chkAllItems(flag,subItem){
var _items=document.getElementsByName(subItem);//取得所有子选项的数组
for(var i=0;i<_items.length;i++){
_items[i].checked=flag;//将所有子选项checkbox的状态和全选checkbox状态设置成一致，即要么同时选中，要么同时取消。
}
}
/*
*每个单选按钮事件
*eg:调用方法
*<input type="checkbox" name="subItem" value="1" onclick="chkSingleItem('allItem','subItem');"/>Trouble is a fridend.
*<input type="checkbox" name="subItem" value="2" onclick="chkSingleItem('allItem','subItem');"/>A place near by .
*
*@allItem 全选框checkbox控件的id值
*@subItem 子选项checkbox的name的名称
*/
function chkSingleItem(allItem,subItem){
var flag=true;//设置默认的全选标识状态为true
var _items=document.getElementsByName(subItem);
for(var i=0;i<_items.length;i++){
if(!_items[i].checked) {
flag=false;//如果子选项中有一个未选中，则设置全选标识状态为false
break;
}
}
document.getElementById(allItem).checked=flag;//重新设置全选状态。
}
/*
*删除选中项按钮的事件
*eg:调用方法 <input type="button" onclick="delSelectedItems('subItem');" value="删除选中"/>
*@subItem 子选项checkbox的name的名称
*@return 返回所有选中的子控件checkbox的value值
*/
function delSelectedItems(subItem){
var ids=[];
var _items=document.getElementsByName(subItem);
for(var i=0;i<_items.length;i++){
if(_items[i].checked) {
ids.push(_items[i].value);
}
}
var _ids =ids.join(',');
if(ids.length==0) {
alert("请选择要删除的选项！");
return false;
}
alert("选中的主键："+ids);
return _ids;
}
function initData(){
var data='';
data+='<li><input type="checkbox" name="subItem" value="1" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Trouble is a fridend.</li>';
data+='<li><input type="checkbox" name="subItem" value="2" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>A place near by .</li>';
data+='<li><input type="checkbox" name="subItem" value="3" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>No pain,no gain.</li>';
data+='<li><input type="checkbox" name="subItem" value="4" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>East and west ,home is best.</li>';
data+='<li><input type="checkbox" name="subItem" value="5" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Beauty lies in the lover\'s eyes.</li>';
data+='<li><input type="checkbox" name="subItem" value="6" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Don\'t bite the hand feed u .</li>';
data+='<li><input type="checkbox" name="subItem" value="7" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Love one another and you\'ll be happy.it\'s as simple and as difficult as that.</li>';
data+='<li><input type="checkbox" name="subItem" value="8" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Do you know how much i love you .</li>';
data+='<li><input type="checkbox" name="subItem" value="9" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>One swallow does not make a summer.</li>';
data+='<li><input type="checkbox" name="subItem" value="10" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Impossible is nothing.</li>';
document.getElementById('dataList').innerHTML=data;
}
onload=function(){initData();}
//-->
</script>
</head>
<body>
<br /> <br /> <br /> <br /> <br />
<ul><li><input type="checkbox" name="AllItem" id="allItem" onclick="chkAllItems(this.checked,'subItem');">全选</li></ul>
<ol id="dataList">
<li>
数据加载中……
</li>
</ol>
<ul><li><input type="button" onclick="delSelectedItems('subItem');" value="删除选中"/></li></ul>
</body>
</html>
<html>
<head>
<title> checkbox全选与取消Demo 2011-08-16 </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="JavaScript">
<!--
/*
* 全选框checkbox控件事件
* eg：调用方法 <input type="checkbox" name="AllItem" id="allItem" onclick="chkAllItems(this.checked,'subItem');">全选
* @flag 全选checkbox控件的状态
*
* @subItem 子选项checkbox的name的名称
*/
function chkAllItems(flag,subItem){
var _items=document.getElementsByName(subItem);//取得所有子选项的数组
for(var i=0;i<_items.length;i++){
_items[i].checked=flag;//将所有子选项checkbox的状态和全选checkbox状态设置成一致，即要么同时选中，要么同时取消。
}
}
/*
*每个单选按钮事件
*eg:调用方法
*<input type="checkbox" name="subItem" value="1" onclick="chkSingleItem('allItem','subItem');"/>Trouble is a fridend.
*<input type="checkbox" name="subItem" value="2" onclick="chkSingleItem('allItem','subItem');"/>A place near by .
*
*@allItem 全选框checkbox控件的id值
*@subItem 子选项checkbox的name的名称
*/
function chkSingleItem(allItem,subItem){
var flag=true;//设置默认的全选标识状态为true
var _items=document.getElementsByName(subItem);
for(var i=0;i<_items.length;i++){
if(!_items[i].checked) {
flag=false;//如果子选项中有一个未选中，则设置全选标识状态为false
break;
}
}
document.getElementById(allItem).checked=flag;//重新设置全选状态。
}
/*
*删除选中项按钮的事件
*eg:调用方法 <input type="button" onclick="delSelectedItems('subItem');" value="删除选中"/>
*@subItem 子选项checkbox的name的名称
*@return 返回所有选中的子控件checkbox的value值
*/
function delSelectedItems(subItem){
var ids=[];
var _items=document.getElementsByName(subItem);
for(var i=0;i<_items.length;i++){
if(_items[i].checked) {
ids.push(_items[i].value);
}
}
var _ids =ids.join(',');
if(ids.length==0) {
alert("请选择要删除的选项！");
return false;
}
alert("选中的主键："+ids);
return _ids;
}
function initData(){
var data='';
data+='<li><input type="checkbox" name="subItem" value="1" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Trouble is a fridend.</li>';
data+='<li><input type="checkbox" name="subItem" value="2" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>A place near by .</li>';
data+='<li><input type="checkbox" name="subItem" value="3" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>No pain,no gain.</li>';
data+='<li><input type="checkbox" name="subItem" value="4" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>East and west ,home is best.</li>';
data+='<li><input type="checkbox" name="subItem" value="5" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Beauty lies in the lover\'s eyes.</li>';
data+='<li><input type="checkbox" name="subItem" value="6" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Don\'t bite the hand feed u .</li>';
data+='<li><input type="checkbox" name="subItem" value="7" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Love one another and you\'ll be happy.it\'s as simple and as difficult as that.</li>';
data+='<li><input type="checkbox" name="subItem" value="8" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Do you know how much i love you .</li>';
data+='<li><input type="checkbox" name="subItem" value="9" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>One swallow does not make a summer.</li>';
data+='<li><input type="checkbox" name="subItem" value="10" onclick="chkSingleItem(\'allItem\',\'subItem\');"/>Impossible is nothing.</li>';
document.getElementById('dataList').innerHTML=data;
}
onload=function(){initData();}
//-->
</script>
</head>
<body>
<br /> <br /> <br /> <br /> <br />
<ul><li><input type="checkbox" name="AllItem" id="allItem" onclick="chkAllItems(this.checked,'subItem');">全选</li></ul>
<ol id="dataList">
<li>
数据加载中……
</li>
</ol>
<ul><li><input type="button" onclick="delSelectedItems('subItem');" value="删除选中"/></li></ul>
</body>
</html>
0 0
- chebox全选 取消全选
- chebox全选 取消全选
- 全选CheBox
- 全选及取消全选
- jquery全选,取消全选
- 全选/取消 全选
- jQuery全选、取消全选
- checkbox 全选 取消全选
- 全选和取消全选
- jquery全选,取消全选
- 全选/取消全选checkbox
- 全选/取消全选
- 全选与取消全选
- icheck 全选 取消全选
- 全选 取消全选
- 单击头模板中的checkbox,实现datalist中所有chebox的全选和取消
- 单击头模板中的checkbox,实现datalist中所有chebox的全选和取消
- 全选/取消
- 命名空间
- java的大小写问题
- 记录下用Windows Azure PowerShell命令工具的使用历程
- rails查看某个路由
- linux关于crontab有些脚本不能定期执行
- chebox全选 取消全选
- 堆和栈
- 女程序员白小白的搞笑段子二则
- sar io 争用
- poj 1986 Distance Queries
- UVa 711 - Dividing up
- 10步成为一个成功的创业者
- 关于在myeclipse下链接oracle 数据库的步骤
- 关于在使用Hibernate注解形成死循环的问题
