jQ學習之實現全選全不選操作

2022-07-12 22:15:20 字數 1284 閱讀 1621

一:比較簡單 詳細說明都在注釋裡了,還是要靈活掌握選擇器的使用

需要注意的是:attr屬性只在jq1.8.3即以下版本有效,如果要在更高版本使用 要是用prop方法

html**:

1

<

table

border

="1px solid"

cellspacing

="0px"

bordercolor

="red"

width

="500px"

align

="center"

style

="text-align: center;"

>

2<

thead

>

3<

th>點選右側實現全選/全不選

th>

4<

th>

5<

input

type

="checkbox"

/>6th

>

7thead

>

8<

tbody

>

9<

tr>

10<

td>

11張三

12td

>

13<

td>

14<

input

type

="checkbox"

name

="c1"

/>

15td

>

16tr

>

17<

tr>

18<

td>

19李四

20td

>

21<

td>

22<

input

type

="checkbox"

name

="c1"

/>

23td

>

24tr

>

25tbody

>

26table

>

jq**

1

//先定義頁面載入函式

2 $(function

());

vue實現全選全不選

全選功能可以說是前端開發中非常常見的乙個功能,以前的專案開發用jquery開發比較多。最近在使用vue前端框架重構之前的專案。從jquery到vue的轉變主要是乙個思想想的轉變,是將原有的直接操作dom的思想轉變到運算元據,用資料驅動dom,也是vue框架的乙個核心思想,思想轉變過來,對功能的實現自...

全選全不選,angularJS如何實現?

最近在學習angularjs,相比於jquery,angularjs雙向資料繫結的功能真的很方便,很強大。但是在實現checkbox全選全不選的時候,好像沒有找到可以直接用的方法。於是決定自己寫乙個。jquery的實現思路 操作dom結構樹,找到需要全選的所有子核取方塊 angularjs的思路 通...

jQuery實現全選 全不選和反選

廖雪峰官網的jquery例子 function var flag false 是否是全選狀態,因為全選和全不選共用選擇框 selectall.change function else selectall.prop checked false 文字變反,選擇也相應變反 invertselect.cli...