这篇文章主要介绍了jquery实现全选、反选、获得所有选中的检验盒功能,对检验盒感兴趣的小伙伴们可以参考一下
举了七个不同的检验盒状态,和大家一一分享。
1、全选
$(#btn1 ).单击(函数(){
$(input[name=checkbox]).attr(checked , true );
})
2、取消全选(全不选)
$(#btn2 ).单击(函数(){
$(input[name=checkbox]).删除属性( checked );
})
3、选中所有奇数
$(#btn3 ).单击(函数(){
$(input[name=checkbox]:odd ).attr(checked , true );
})
4、选中所有偶数
$(#btn6 ).单击(函数(){
$(input[name=checkbox]:even ).attr(checked , true );
})
5、反选
$(#btn4 ).单击(函数(){
$(input[name=checkbox]).each(function(){
如果($(这个)。属性(已检查))
{
$(这个)。删除属性( checked );
}
其他
{
$(这个)。attr(checked , true );
}
})
})
或者
$(#invert ).单击(函数(){
$( # rule message[name= delModuleID ]:checkbox)).每个(函数(I,o){
美元.属性(已检查,美元.attr( checked );
});
});
6、获取选择项的值
var aa=
$(#btn5 ).单击(函数(){
$( input[name= checkbox ]:checkbox:checked)).each(function(){
aa=$(这个)。瓦尔()
})
文档。写(aa);
})
})
7、遍历选中项
$( input[type=checkbox][checked]).each(function(){
//由于复选框一般选中的是多个,所以可以循环输出
警报($(这个)。val());
});
下面实例讲述了jquery实现全选、反选、获得所有选中的复选框。分享给大家供大家参考。具体如下:
运行效果截图如下:
具体代码如下:
html xmlns= http://。w3。 org/1999/XHTML
head runat=server
标题无标题页/标题
脚本src= js/jquery-1.6。量滴js type= text/JavaScript /script
脚本类型=文本/javascript
jQuery(函数($){
//全选
$(#btn1 ).单击(函数(){
$(input[name=checkbox]).attr(checked , true );
})
//取消全选
$(#btn2 ).单击(函数(){
$(input[name=checkbox]).删除属性( checked );
})
//选中所有基数
$(#btn3 ).单击(函数(){
$(input[name=checkbox]:even ).attr(checked , true );
})
//选中所有偶数
$(#btn6 ).单击(函数(){
$(input[name=checkbox]:odd ).attr(checked , true );
})
//反选
$(#btn4 ).单击(函数(){
$(input[name=checkbox]).each(function(){
如果($(这个)。属性(已检查))
{
$(这个)。删除属性( checked );
}
其他
{
$(这个)。attr(checked , true );
}
})
})
//或许选择项的值
var aa=
$(#btn5 ).单击(函数(){
$( input[name= checkbox ]:checkbox:checked)).each(function(){
aa=$(这个)。瓦尔()
})
文档。写(aa);
})
})
/脚本
/头
身体
表单id=form1 runat=server
差异
输入类型=button id=btn1 value=全选
输入类型=button id=btn2 value=取消全选
输入类型=button id=btn3 value=选中所有奇数
输入类型=按钮id=btn6 值=选中所有偶数
输入类型=button id=btn4 value=反选
输入类型=button id=btn5 value=获得选中的所有值
英国铁路公司
输入类型=复选框名称=复选框值=复选框1
复选框一
输入类型=复选框名称=复选框值=复选框2
复选框2
输入类型=复选框名称=复选框值=复选框3
复选框3
输入类型=复选框名称=复选框值=复选框4
复选框四
输入类型=复选框名称=复选框值=复选框5
复选框5
输入类型=复选框名称=复选框值=复选框6
复选框6
输入类型=复选框名称=复选框值=复选框7
复选框七
输入类型=复选框名称=复选框值=复选框8
复选框8
/div
/表单
/body
/html
以上就是关于jquery中检验盒使用方法简单实例演示,希望对大家的学习有所帮助。