js實現全選和反選功能

2022-05-05 23:24:19 字數 2600 閱讀 8290

1.頁面

<

html

>

<

head

><

title

>匯出excel

title

><

head

>

<

body

>

<

p style

="text-align:center; padding-top:15px"

>

選擇班級:

<

select

name

="claid"

id="claid"

style

="color:#999999"

>

<

option

value

="0"

style

="color:#999999"

>==選擇==

option

>

<

option

value

=1 style

="color:#000000"

>藥學1班

option

>

<

option

value

=2 style

="color:#000000"

>藥學2班

option

>

select

>

p>

<

p>

p>

<

p style

="text-align:center; padding-top:15px"

> 選擇需要匯出的選項:

br>

<

input

type

="checkbox"

name

="stu"

id="a"

value

="考生學號"

>考生學號  

<

input

type

="checkbox"

name

="stu"

id="a"

value

="考生姓名"

>考生姓名

br>

<

input

type

="checkbox"

name

="stu"

id="a"

value

="考生班級"

>考生班級  

<

input

type

="checkbox"

name

="stu"

id="a"

value

="考生性別"

>考生性別

br>

<

input

type

="checkbox"

name

="stu"

id="a"

value

="考試得分"

>考試得分  

<

input

type

="checkbox"

name

="stu"

id="a"

value

="測試時間"

>測試時間

br>

<

input

type

="checkbox"

name

="stu"

id="a"

value

="交卷時間"

>交卷時間  

<

input

type

="checkbox"

name

="stu"

id="a"

value

="考試用時"

>考試用時

br>

p>

<

p style

="text-align:center; padding-top:15px"

>

<

input

type

="button"

value

="全選"

onclick

="allselecttype();"

/>

<

input

type

="button"

value

="反選"

onclick

="invertselecttype();"

/>

p>

body

>

html

>

2.相關的js**

//

反選function

invertselecttype()

else

}}//

全選function

allselecttype()

}

js實現全選和反選功能

全選反選 足球籃球 跑步登山 唱歌跳舞 思路 1 獲取元素。2 用for迴圈歷遍陣列,把checkbox的checked設定為true即實現全選,把checkbox的checked設定為false即實現不選。3 通過if判斷,如果checked為true選中狀態的,就把checked設為false不...

jquery實現全選和反選功能

jquery操作核取方塊的選中和不選中狀態非常簡單,使用attr 來設定 checked 屬性的值,true未選中,false為未選中,在整個全選 反選過程中注意處理全選核取方塊的選中狀態,以及獲取選中選項的值。ul id list li label input type checkbox valu...

jquery實現全選 反選功能

如何利用jquery是先簡單的全選反選功能 首先我們需要載頁面中引入jquery jquery 3.4.1.min.js script 然後我們需要引入input標籤 全選 checkbox id checkall 反選 checkbox id checkother checkbox li chec...