JQuery Checkbox是一種方便的方式來添加有道義的UI元素的,特別是當你需要判斷用戶選中的哪些選項時。該過程非常簡單,只需要使用適當的JQuery代碼和一些簡單的HTML。以下是一個簡單的例子:
<input type="checkbox" class="myCheckBox" name="checkbox1" value="1"/> <input type="checkbox" class="myCheckBox" name="checkbox2" value="2"/> <input type="checkbox" class="myCheckBox" name="checkbox3" value="3"/> <input type="checkbox" class="myCheckBox" name="checkbox4" value="4"/> <input type="checkbox" class="myCheckBox" name="checkbox5" value="5"/>
以上HTML代碼會創建5個帶有相同類名的復選框輸入框。當點擊一個或多個復選框時,我們需要確定哪一個被選中了。下面的JQuery代碼將返回所有選中的復選框的值:
$('input.myCheckBox:checked').each(function() { console.log($(this).val()); });
JQuery代碼中使用了":checked"選擇器,它只選擇被選中的復選框,而不是所有的復選框。如果多個復選框被選中,則"each()"函數將對每個選中的復選框進行迭代。在每次迭代中,用"console.log()"函數輸出選中復選框的值。
如果你只想知道是否有一個或多個復選框被選中,而不需要知道具體是哪個,那么可以使用以下代碼:
if ($('input.myCheckBox:checked').length >0) { console.log("至少有一個復選框被選中!"); }
以上JQuery代碼使用"length"屬性來檢查被選中的復選框數量是否大于0,如果是,那么就可以知道至少有一個被選中。