jquery處理checkbox（復(fù)選框）是否被選中實(shí)例代碼
更新時(shí)間：2017年06月12日 10:50:38 作者：sdusdu
這篇文章主要介紹了jquery處理checkbox（復(fù)選框）是否被選中實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下
jquery處理checkbox（復(fù)選框）是否被選中
現(xiàn)在如果一個(gè)復(fù)選框被選中，是用checked=true，checked="checked"也行
要用prop代替attr會(huì)更好，雖然在jQuery1.6之前版本的attr()方法能正常使用，但是現(xiàn)在必須使用prop()方法代替
實(shí)例代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>checkbox</title>
</head>
<body>
<input type="button" id="btn1" value="全選">
<input type="button" id="btn2" value="取消全選">
<input type="button" id="btn3" value="選中所有奇數(shù)">
<input type="button" id="btn4" value="反選">
<input type="button" id="btn5" value="獲得選中的所有值">
<input type="checkbox" value="checkbox1"/>
<input type="checkbox" value="checkbox2"/>
<input type="checkbox" value="checkbox3"/>
<input type="checkbox" value="checkbox4"/>
<input type="checkbox" value="checkbox5"/>
<script src="js/jquery-3.2.0.min.js"></script>
<script>
$(function(){
var checkbox = $("input[type=checkbox]");
$("#btn1").on("click",function(){
checkbox.prop("checked",true);
});
$("#btn2").on("click",function(){
checkbox.prop("checked",false);
});
$("#btn3").on("click",function(){
$("input[type=checkbox]:even").prop("checked",true);
});
$("#btn4").on("click",function(){
checkbox.each(function(){
if($(this).prop("checked")){
$(this).prop("checked",false);
}else{
$(this).prop("checked",true);
}
});
});
$("#btn5").on("click",function(){
var str = "";
$("input[type=checkbox]").each(function(){
if($(this).prop("checked")){
str += $(this).val() + ",";
}
});
console.log(str);
});
});
</script>
</body>
</html>
感謝閱讀，希望能幫助到大家，謝謝大家對(duì)本站的支持！
您可能感興趣的文章:
- jQuery實(shí)現(xiàn)CheckBox全選、全不選功能
- jQuery操作復(fù)選框(CheckBox)的取值賦值實(shí)現(xiàn)代碼
- jQuery設(shè)置和獲取select、checkbox、radio的選中值方法
- jQuery實(shí)現(xiàn)的checkbox級(jí)聯(lián)選擇下拉菜單效果示例
- jQuery中checkbox反復(fù)調(diào)用attr(''checked'', true/false)只有第一次生效的解決方法
- jquery操作checkbox火狐下第二次無(wú)法勾選的解決方法
- jQuery實(shí)現(xiàn)點(diǎn)擊行選中或取消CheckBox的方法
相關(guān)文章
jquery實(shí)現(xiàn)浮動(dòng)在網(wǎng)頁(yè)右下角的彩票開(kāi)獎(jiǎng)公告窗口代碼
這篇文章主要介紹了jquery實(shí)現(xiàn)浮動(dòng)在網(wǎng)頁(yè)右下角的彩票開(kāi)獎(jiǎng)公告窗口代碼,涉及jquery窗體的彈出及隱藏相關(guān)實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09
jQuery在ie6下無(wú)法設(shè)置select選中的解決方法詳解
這篇文章主要介紹了jQuery在ie6下無(wú)法設(shè)置select選中的解決方法,結(jié)合實(shí)例分析了jQuery在ie6下無(wú)法設(shè)置select選中的原因與相關(guān)處理技巧,需要的朋友可以參考下2016-09-09
這篇文章主要介紹了jQuery 禁止表單用戶名、密碼自動(dòng)填充功能,需要的朋友可以參考下2017-10-10
jquery 清空f(shuō)ile域示例(兼容個(gè)瀏覽器)
在本文將為大家介紹喜下如何使用jquery 清空f(shuō)ile域并做到兼容個(gè)瀏覽器，感興趣的朋友可以參考下2013-10-10
jQuery的load()方法及其回調(diào)函數(shù)用法實(shí)例
這篇文章主要介紹了jQuery的load()方法及其回調(diào)函數(shù)用法,實(shí)例分析了load方法的簡(jiǎn)單使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-03-03
這篇文章主要介紹了jQuery輕量級(jí)表單模型驗(yàn)證插件的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-10-10
本文給大家分享的是個(gè)人關(guān)于jQuery中事件的理解，主要向大家介紹了jQuery中事件的綁定，合成、以及事件冒泡、阻止事件等內(nèi)容，希望大家能夠喜歡。2015-03-03
jQuery使用$.ajax進(jìn)行即時(shí)驗(yàn)證實(shí)例詳解
這篇文章主要介紹了jQuery使用$.ajax進(jìn)行即時(shí)驗(yàn)證的方法,以完整實(shí)例形式較為詳細(xì)的分析了jQuery前臺(tái)控制ajax交互與后臺(tái)asp.net響應(yīng)處理的詳細(xì)實(shí)現(xiàn)技巧,需要的朋友可以參考下2015-12-12
jQuery 的 tagit 插件效果還是不錯(cuò)的，今天用到該插件，下面給大家詳細(xì)講解下此插件的具體用法。這里推薦給大家，有需要的小伙伴可以參考下。2015-04-04
jQuery easyui的validatebox校驗(yàn)規(guī)則擴(kuò)展及easyui校驗(yàn)框validatebox用法
這篇文章主要介紹了jQuery easyui的validatebox校驗(yàn)規(guī)則擴(kuò)展及easyui校驗(yàn)框validatebox用法的相關(guān)資料,需要的朋友可以參考下2016-01-01