本文实例总结了jQuery操作表单常用控件方法。分享给大家供大家参考。具体如下:
下面的JS代码列出了jQuery操作表单常用控件(包括select,radioBox,checkBox)的常用方法,相信一定有你需要的
操作radio的HTML代码
dion
1.获取选中值,三种方法都可以:
dio:checked').val();
$("input[type='ra
dio']:checked").val();
$("input[name='rd']:checked").val();
2.设置第一个Radio为选中值:
dio:first').attr('checked','checked');
或者
dio:first').attr('checked','true');
注:
3.设置最后一个Radio为选中值:
dio:last').attr('checked','checked');
或者
dio:last').attr('checked','true');
4.根据索引值设置任意一个radio为选中值:
dio').eq(索引值).attr('checked','true');
索引值=0,1,2....
或者
dio').slice(1,2).attr('checked','true');
5.根据Value值设置Radio为选中值
dio[value='rd2']").attr('checked','true');
或者
6.删除Value值为rd2的Radio
dio[value='rd2']").remove();
7.删除第几个Radio
dio").eq(索引值).remove();
索引值=0,2....
如删除第3个Radio:
dio").eq(2).remove();
8.遍历Radio
dio').each(function(index,domEle){
//写入
代码
});
下面的代码演示了DropDownList的常用操作方法
1. 获取选中项的Value值:
或者
获取选中项的Text值:
或者
2. 获取当前选中项的索引值:
3. 获取当前option的最大索引值:
4. 获取DropdownList的长度:
或者
5. 设置第一个option为选中值:
或者
6.设置最后一个option为选中值:
7. 根据索引值设置任意一个option为选中值:
索引值=0,2....
8. 设置Value=4 的option为选中值:
或者
9. 删除Value=3的option:
10.删除第几个option:
索引值=0,2....
如删除第3个Radio:
11.删除第一个option:
或者
12. 删除最后一个option:
13. 删除dropdownlist:
14.在select后面添加一个option:
f");
15. 在select前面添加一个option:
0");
16. 遍历option:
代码
});
下面的代码演示了jQuery常用操作checkBox的方法
Box
1. 获取单个checkBox选中项(三种写法):
Box:checked").val()
或者
Box']:checked").val();
或者
2. 获取多个checkBox选中项:
Box').each(function() {
if ($(this).attr('checked') ==true) {
alert($(this).val());
}
});
3. 设置第一个checkBox 为选中值:
Box:first').attr("checked",'checked');
或者
Box').eq(0).attr("checked",'true');
4. 设置最后一个checkBox为选中值:
dio:last').attr('checked','true');
5. 根据索引值设置任意一个checkBox为选中值:
Box).eq(索引值).attr('checked','true');
6. 选中多个checkBox:
同时选中第1个和第2个的checkBox:
dio').slice(0,'true');
7. 根据Value值设置checkBox为选中值:
Box[value='1']").attr('checked','true');
8. 删除Value=1的checkBox:
Box[value='1']").remove();
9. 删除第几个checkBox:
Box").eq(索引值).remove();
索引值=0,2....
如删除第3个checkBox:
Box").eq(2).remove();
10.遍历checkBox:
Box').each(function (index,domEle) {
//写入
代码
});
11.全部选中
Box').each(function() {
$(this).attr('checked',true);
});
12.全部取消选择:
Box').each(function () {
$(this).attr('checked',false);
});
希望本文所述对大家的jQuery程序设计有所帮助。