在使用jQuery構建交互式網頁時,經常需要使用復選框和單選按鈕來收集用戶信息或進行過濾操作。當用戶完成相關操作后,如何獲取已選中的復選框或單選按鈕呢?
jQuery提供了一個簡單的方法來解決這個問題,即使用:checked
選擇器。該選擇器用于檢查復選框和單選按鈕是否被選中,并返回一個布爾值。
例如,下面的HTML代碼中有兩個復選框:
<input type="checkbox" name="option1" value="1" />Option 1 <input type="checkbox" name="option2" value="2" />Option 2
要檢查哪些復選框被選中,可以使用以下jQuery代碼:
$('input[name="option1"]:checked').val(); // "1" $('input[name="option2"]:checked').val(); // "2"
可以看到,:checked
選擇器返回的是被選中的復選框的值,如果沒有選中任何復選框,則返回undefined
。
類似地,如果想檢查單選按鈕是否被選中,也可以使用:checked
選擇器:
<input type="radio" name="gender" value="male" />Male <input type="radio" name="gender" value="female" />Female
$('input[name="gender"]:checked').val(); // "male" 或 "female"
使用:checked
選擇器,可以輕松地獲取已選中的復選框或單選按鈕,并進行相應的操作。