Home  >  Article  >  Web Front-end  >  jquery checkbox获取和设置选中值的一些操作

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

WBOY
WBOYOriginal
2016-06-01 09:54:481155browse
<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>

 

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn