首頁 > 其他

如何利用jquery,實現checkbox核取方塊全選功能?

2019-12-12 12:58:04

在做頁面開發時,我們有時需要使用到checkbox,當有多個核取方塊時,如何實現點選一個全選的核取方塊,然後把其他的都選上?下面來看一下。

1

先在程式碼裡,引入jquery指令碼。


2

然後建立一些核取方塊,為全選的第一個核取方塊加上id,其他的加上class樣式。


3

通過id為第一個核取方塊新增change事件。


4

事件裡先通過prop方法獲得核取方塊當前是選中還是沒有選中的狀態。


5

然後把這個值賦值到其他的核取方塊裡,同樣是使用prop方法來設定。


6

就這麼簡單,程式碼就這麼多了,執行頁面,目前是沒有選中的,我們點選第一個核取方塊。


7

點選後,其他的核取方塊會和第一個一樣全部處於選中狀態,再點選取消第一個的選中,其他的也會一樣全部沒有選中的。



IT145.com E-mail:sddin#qq.com