1. 程式人生 > >Jquery操作複選框(CheckBox)的取值賦值實現程式碼

Jquery操作複選框(CheckBox)的取值賦值實現程式碼

賦值 複選框 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', 'checked'); 
或者 
$('input:radio:last').attr('checked', 'true');

5. 根據索引值設定任意一個checkbox為選中值:

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

6. 選中多個checkbox:

同時選中第1個和第2個的checkbox:
$('input:radio').slice(0,2).attr('checked','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,1,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); 
});

Jquery通過遍歷陣列給checkbox賦預設值

需求:有一個數組:(北京菜,粵菜),checkbox如下:

現在想通過遍歷這個陣列,使數組裡包含的值,在checkbox選中

程式碼:

var flavors = new Array([北京菜 , 粵菜]);

$.each(flavors,function(i,item){

$("input[name='checkboxFlavor'][value="+item+"]").attr("checked","checked");

});