全選功能的實現主要分兩步:
1. 點擊全選框選中所有選擇框。
2. 當所有選擇框都被選中時,勾選全選框。
詳細思路:
1. 點擊全選框選中所有選擇框:
給全選框綁定一個值,然后添加change時間,當全選框的值改變時給所有選擇框的值賦與全選框的值。
2. 當所有選擇框都被選中時,選中全選框:
給所有選擇框都添加change事件,當某個選擇框的值改變時,檢查所有選擇框的狀態:只要有一個選擇框沒被選中,則把全選框的值設為false,否則設為true。
注意:兩步的關鍵區別在於,一個是通過事件改變,一個是通過值改變,這樣可以避免陷入死循環。若是都通過監聽事件改變或監聽值改變,會陷入死循環。
基礎知識:選擇框的值是input標簽的checked屬性,當type為radio或checkbox時有效。