Heim >Web-Frontend >js-Tutorial >jquery checkbox获取和设置选中值的一些操作

jquery checkbox获取和设置选中值的一些操作

WBOY
WBOYOriginal
2016-06-01 09:54:481178Durchsuche
<code class="language-html"><input type="checkbox" name="ck">php
<input type="checkbox" name="ck">mysql
<input type="checkbox" name="ck">jquery
<input type="checkbox" name="ck">java</code>

1. 获取单个checkbox选中项: 

<code class="language-javascript">$("input:checkbox:checked").val() 
或者 
$("input:[type='checkbox']:checked").val(); 
或者 
$("input:[name='ck']:checked").val(); </code>


2. 获取多个checkbox选中项: 

<code class="language-javascript">$('input:checkbox').each(function() { 
if ($(this).attr('checked') ==true) { 
alert($(this).val()); 
} 
}); </code>


3. 设置第一个checkbox 为选中值: 

<code class="language-javascript">$('input:checkbox:first').attr("checked",'checked'); 
或者 
$('input:checkbox').eq(0).attr("checked",'true'); </code>


4. 设置最后一个checkbox为选中值: 

<code class="language-javascript">$('input:checkbox:last').attr('checked', 'checked'); 
或者 
$('input:checkbox:last').attr('checked', 'true');</code>

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

<code class="language-javascript">$('input:checkbox').eq(索引值).attr('checked', 'true');索引值=0,1,2.... 
或者 
$('input:checkbox').slice(1,2).attr('checked', 'true'); </code>


6. 选中多个checkbox: 
同时选中第1个和第2个的checkbox: 

<code class="language-javascript">$('input:checkbox').slice(0,2).attr('checked','true'); </code>


7. 根据Value值设置checkbox为选中值: 

<code class="language-javascript">$("input:checkbox[value='1']").attr('checked','true'); </code>


8. 删除Value=1的checkbox: 

<code class="language-javascript">$("input:checkbox[value='1']").remove(); </code>


9. 删除第几个checkbox: 

<code class="language-javascript">$("input:checkbox").eq(索引值).remove();索引值=0,1,2.... </code>

如删除第3个checkbox: 

<code class="language-javascript">$("input:checkbox").eq(2).remove(); </code>


10.遍历checkbox: 

<code class="language-javascript">$('input:checkbox').each(function (index, domEle) { 
//写入代码 
}); </code>


11.checkbox全部选中 

<code class="language-javascript">$('input:checkbox').each(function() { 
$(this).attr('checked', true); 
}); </code>


12.checkbox全部取消选择: 

<code class="language-javascript">$('input:checkbox').each(function () { 
$(this).attr('checked',false); 
});</code>

 

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn