JS如何實現對name是陣列的核取方塊的全選和反選以及取消選擇
JS如何實現對name是陣列的核取方塊的全選和反選以及取消選擇? form內容如下:
因為PHP接收要用 陣列形式的 核取方塊,正常情況下 JQ可如果是這種
直接使用 $(“input[name=ptpt])即可。但是這種php接收的只是最後一個值,字串。
<label><input type=`checkbox` name=`ptpt` value=`a1` />a1</label>
<label><input type=`checkbox` name=`ptpt` value=`a3` />a3</label>
<label><input type=`checkbox` name=`ptpt` value=`a6` />a6</label>
<label><input type=`checkbox` name=`ptpt` value=`a9` />a9</label>
這樣PHP接收的是一個 ptpt的陣列
<form method=”post” id=”form1″ name=”form1″ action=”” >
<label><input type=`checkbox` name=`ptpt[1]` value=`a1` />a1</label>
<label><input type=`checkbox` name=`ptpt[3]` value=`a3` />a3</label>
<label><input type=`checkbox` name=`ptpt[6]` value=`a6` />a6</label>
<label><input type=`checkbox` name=`ptpt[9]` value=`a9` />a9</label>
<input type=”button” value=”全選” onclick=””>
<input type=”button” value=”反選” onclick=””>
<input type=”button” value=”取消全選” onclick=””>
<script src=”jquery-1.7.2.min.js”></script>
<script>
$(function(){
var chks = $(`:checkbox[name^=”ptpt[“]`); //匹配name開頭為 ptpt[ 的部分
$(`:button:eq(0)`).click(function(){
chks.attr(`checked`,`checked`);
})
$(`:button:eq(1)`).click(function(){
chks.each(function(){
if($(this).attr(`checked`)==`checked`)
$(this).removeAttr(`checked`);
else
$(this).attr(`checked`,`checked`);
});
})
$(`:button:eq(2)`).click(function(){
chks.removeAttr(`checked`);
})
})
</script>
本文轉自 陳小龍哈 51CTO部落格,原文連結:http://blog.51cto.com/chenxiaolong/1857132
相關文章
- jQuery核取方塊checkbox的全選和反選jQuery
- 小程式核取方塊全選和全部取消
- JavaScript 核取方塊全選和全不選JavaScript
- 對於核取方塊的快捷選擇
- 使用jQuery做核取方塊的全選與取消jQuery
- JavaScript核取方塊全選和全不選詳解JavaScript
- 點選文字選中或取消選中checkbox核取方塊
- jquery table下的核取方塊選中、取消jQuery
- checkbox 核取方塊全選程式碼
- JavaScript獲取選中checkbox核取方塊的選中值JavaScript
- vxe-table 實現核取方塊多選透過滑鼠拖動選擇功能
- 單選按鈕和核取方塊
- React實現全選和反選React
- js checkbox 全選 取消全選JS
- 網頁設計實現核取方塊(checkbox)和單選框(radio)對齊的方法網頁
- vue checkbox 實現全選,取消全選Vue
- JavaScript 獲取選中checkbox核取方塊的值JavaScript
- JS基礎入門篇(四)—this的使用,模擬單選框,選項卡和核取方塊JS
- 基礎元件:單選開關和核取方塊元件
- jQuery Validate限定核取方塊選中的數目jQuery
- JavaScript刪除核取方塊選中的表格行JavaScript
- JavaScript 限制核取方塊選中數目JavaScript
- vxe-table 多選、使用表格多選資料、核取方塊多選
- [譯]JS Tips:選擇(picking)和反選(rejecting)物件的屬性JS物件
- JavaScript 判斷checkbox核取方塊是否選中JavaScript
- 直播系統原始碼,單選按鈕和核取方塊原始碼
- checkBox核取方塊,獲得選中那一行所有列的資料
- Matlab - 獲取和儲存檔案路徑選擇對話方塊Matlab
- 陣列選擇排序陣列排序
- 【新特性速遞】樹表格核取方塊與級聯選擇(TreeCheckBox,TreeCascadeCheck)
- CSS3 checkbox核取方塊和radio單選框美化效果CSSS3
- js選擇物件和jq選擇物件的區別JS物件
- 【Android初級】如何實現一個具有選擇功能的對話方塊效果(附原始碼)Android原始碼
- Yii2 中 checkboxlist 核取方塊 預設選中
- 表格核取方塊的勾選,翻頁後,表格頂部的刪除按鈕,是刪除當前頁的選中還是包括之前的選中?
- Jquery實現頁面的新增、刪除、全選、取消全選、漸變色jQuery
- 使用 CSS 選擇器實現對不含 title 屬性元素的選擇CSS
- 如何從效能角度選擇陣列的遍歷方式陣列
- Android 學習筆記之單選按鈕(RadioButton)和核取方塊(CheckBox)Android筆記