jQuery中的CheckBox、RadioButton、DropDownList的取值赋值

随着Jquery的作用越来越大，使用的朋友也越来越多。在Web中，由于CheckBox、 Radiobutton 、 DropDownList等控件使用的频率比较高，就关系到这些控件在Jquery中的操作问题。由于Jquery的版本更新很快，代码的写法也改变了许多，以下Jquery代码适query1.4版本以上。

Radio                                                

  

1.获取选中值，三种方法都可以：

$('input:radio:checked').val()；

$(input[type='radio']:checked).val();

$(input[name='rd']:checked).val();

2.设置第一个Radio为选中值：

    $('input:radio:first').attr('checked','checked');

或者

$('input:radio:first').attr('checked','true');

注： attr(checked,'checked')= attr(checked,'true')= attr(checked,true)

3.设置最后一个Radio为选中值：

$('input:radio:last').attr('checked','checked');

或者

$('input:radio:last').attr('checked','true');

4.根据索引值设置任意一个radio为选中值：

$('input:radio').eq(索引值).attr('checked','true');索引值=0,1,2....

或者

$('input:radio').slice(1,2).attr('checked','true');

5.根据Value值设置Radio为选中值

$(input:radio[value='rd2']).attr('checked','true');

或者

$(input[value='rd2']).attr('checked','true');

6.删除Value值为rd2的Radio

$(input:radio[value='rd2']).remove();

7.删除第几个Radio

$(input:radio).eq(索引值).remove();索引值=0,2....

如删除第3个Radio:$(input:radio).eq(2).remove();

8.遍历Radio

$('input:radio').each(function(index,domEle){

     //写入代码

});

DropDownList

 

1.   获取选中项：

获取选中项的Value值：

      $('select#sel option:selected').val();

     或者

       $('select#sel').find('option:selected').val();

获取选中项的Text值：

      $('select#seloption:selected').text();

     或者

       $('select#sel').find('option:selected').text();

2.   获取当前选中项的索引值：

$('select#sel').get(0).selectedindex;

3.   获取当前option的最大索引值：

$('select#sel option:last').attr(index)

4.   获取DropdownList的长度：

$('select#sel')[0].options.length;

或者

$('select#sel').get(0).options.length;

5.  设置第一个option为选中值：

$('select#sel option:first').attr('selected','true')

或者

 $('select#sel')[0].selectedindex = 0;

6.   设置最后一个option为选中值：

$('select#sel option:last).attr('selected','true')

7.   根据索引值设置任意一个option为选中值：

$('select#sel')[0].selectedindex =索引值;索引值=0,2....

8.   设置Value=4 的option为选中值：

$('select#sel').attr('value','4');

或者

$(select#sel option[value='4']).attr('selected','true');

9.   删除Value=3的option：

$(select#sel option[value='3']).remove();

10.删除第几个option：

$( select#sel option ).eq(索引值).remove();索引值=0,2....

如删除第3个Radio:

$( select#sel option ).eq(2).remove();

11.删除第一个option：

$( select#sel option ).eq(0).remove();

或者

$(select#sel option:first).remove();

12. 删除最后一个option：

$(select#sel option:last).remove();

13. 删除dropdownlist:

$(select#sel).remove();

14.在select后面添加一个option:

$(select#sel).append(<option value='6'>f</option>);

15. 在select前面添加一个option:

$(select#sel).prepend(<option value='0'>0</option>);

16. 遍历option：

$(' select#sel option ').each(function (index,domEle) {

//写入代码
});

CheckBox

1.   获取单个checkBox选中项(三种写法)：

$(input:checkBox:checked).val()

或者

$(input:[type='checkBox']:checked).val();

或者

$(input:[name='ck']:checked).val();

2.   获取多个checkBox选中项：

    $('input:checkBox').each(function() {

            if ($(this).attr('checked') ==true) {

                alert($(this).val());

            }

        });

3.   设置第一个checkBox 为选中值：

$('input:checkBox:first').attr(checked,'checked');

或者

     $('input:checkBox').eq(0).attr(checked,'true');

4.   设置最后一个checkBox为选中值：

$('input:radio:last').attr('checked','true');

5.   根据索引值设置任意一个checkBox为选中值：

$('input:checkBox).eq(索引值).attr('checked','true');

6.   选中多个checkBox：

同时选中第1个和第2个的checkBox：

$('input:radio').slice(0,'true');

7.   根据Value值设置checkBox为选中值：

$(input:checkBox[value='1']).attr('checked','true');

8.   删除Value=1的checkBox：

$(input:checkBox[value='1']).remove();

9.   删除第几个checkBox：

$(input:checkBox).eq(索引值).remove();索引值=0,2....

如删除第3个checkBox:

$(input:checkBox).eq(2).remove();

10.遍历checkBox：

$('input:checkBox’).each(function (index,domEle) {

//写入代码
});

11.全部选中

     $('input:checkBox').each(function() {

      $(this).attr('checked',true);

     });

12.全部取消选择：

$('input:checkBox').each(function () {

 $(this).attr('checked',false);

});

（来源：博客园）