直接複製儲存用瀏覽器開啟可以看效果，功能實現挺好的。1doctype html
>
2<
html
lang
="zh-cn"
>34
<
head
>
5<
meta
charset
="utf-8"
>
6<
title
>jquery實現全選、反選和不選功能
title
>78
<
link
href
=""rel="stylesheet"
>
9<
script
src=""
>
script
>
1011
15<
script
>
16$(
function
()
else
24});
25//
全選
26$(
"#selectall
").click(
function
() );
29//
全不選30$("
#unselect
").click(
function
() );
33//
反選 34$("
#reverse
").click(
function
() );
38allchk();
39});
4041
//設定全選核取方塊
42$(
"#list :checkbox
").click(
function
() );
4546
//獲取選中選項的值
47$(
"#getvalue
").click(
function
() );
54var
vals
=valarr.join(',
');55alert(vals);
56});
57});
5859
function
allchk()
66});
67if
(chknum
==chk)
else72}
73script
>
7475
76head
>
7778
<
body
>
79<
div
class
="bg-info text-center"
style
="height:100px;line-height:100px;font-size:26px;
font-family: '微軟雅黑';"
>
80jq應用第6款：jquery實現的全選、反選和不選功能
81div
>
8283
<
div
style
="margin-top:50px;"
>
84<
div
class
="col-xs-3"
>
div>
85<
div
class
="col-xs-6"
>
8687
8889
90<
ul id
="list"
class
="list-unstyled"
>
91<
li>
92<
input
type
="checkbox"
value
="1"
>
1.aa
93li
>
94<
li>
95<
input
type
="checkbox"
value
="2"
>
2.bb
96li
>
97<
li>
98<
input
type
="checkbox"
value
="3"
>
3.cc
99li
>
100<
li>
101<
input
type
="checkbox"
value
="4"
>
4.dd
102li
>
103<
li>
104<
input
type
="checkbox"
value
="5"
> 5.ee
label
>
105li
>
106<
li>
107<
input
type
="checkbox"
value
="6"
>
6.ff
108li
>
109ul
>
110111
<
input
type
="checkbox"
id="all"
>
112<
input
type
="button"
value
="全選"
class
="btn btn-info "
id="selectall"
>
113<
input
type
="button"
value
="全不選"
class
="btn btn-info "
id="unselect"
>
114<
input
type
="button"
value
="反選"
class
="btn btn-info "
id="reverse"
>
115<
input
type
="button"
value
="獲得選中的所有值"
class
="btn btn-info"
id="getvalue"
>
116117
118119
120121
div>
122<
div
class
="col-xs-3"
>
div>
123div
>
124body
>
125126
html
>
全選 不選和反選
今天我們來學習一下如何實現全選 不選和反選，首先我們來看一張收件箱的。收件箱如果只是簡單的刪除幾封郵件，選中刪除就可以了，但是如果郵箱裡堆滿了郵件，乙個乙個的選中再刪除，太過於浪費精力。今天你學會了如何實現全選 不選和反選，就可以不花精力的刪掉過期的郵件。接下來我們看效果圖。沒被選中之前 全選 不選...
jQuery實現的全選 反選和不選功能
我們的頁面上有乙個歌曲列表，列出多行歌曲名稱，並匹配核取方塊供使用者選擇，並且在列表下方有一排操作按鈕。type checkbox id all type button value 全選 class btn id selectall type button value 全不選 class btn i...
jQuery實現的全選 反選和不選功能
本文給大家分享一段基於jquery的全選 反選和不選功能的 適用於網頁多選後需要進行批量操作的場景 如批量刪除等 文章結合例項，簡潔，基本覆蓋選項選擇操作的方方面面，希望可以幫到有需要的web愛好者。html 我們的頁面上有乙個歌曲列表，列出多行歌曲名稱，並匹配核取方塊供使用者選擇，並且在列表下方有...