查找所有選中的復選框和單選按鈕

Question

我想找到所有選中的復選框和單選按鈕。 雖然我可以這樣做：

var abc = document.querySelectorAll(".some_class input[type='checkbox']:checked");

如何實際同時找到復選框和單選按鈕？ 純JavaScript。

Answer 1

如前所述

“ .some_class輸入：已選中”

樣品：

 function notify(){ var els = document.querySelectorAll('input:checked'); for(var i = 0; i< els.length; i++){ console.log(els[i].type, els[i].value) } } 

 <input type="checkbox" value="1">1 <input type="checkbox" value="2">2 <input type="checkbox" value="3">3 <input type="checkbox" value="4">4 <input type="checkbox" value="5">5 <br/> <input type="radio" name="test" value="1">1 <input type="radio" name="test" value="2">2 <input type="radio" name="test"value="3">3 <input type="radio" name="test" value="4">4 <input type="radio" name="test" value="5">5 <button onclick="notify()"> Check </button> 

但是，如果您為復選框和單選按鈕使用不同的選擇器，則可以嘗試以下操作：

 function notify(){ var els = document.querySelectorAll('.chks input[type="checkbox"]:checked, .rbs input[type="radio"]:checked'); for(var i = 0; i< els.length; i++){ console.log(els[i].type, els[i].value) } } 

 <div class="chks"> <input type="checkbox" value="1">1 <input type="checkbox" value="2">2 <input type="checkbox" value="3">3 <input type="checkbox" value="4">4 <input type="checkbox" value="5">5 </div> <div class="rbs"> <input type="radio" name="test" value="1">1 <input type="radio" name="test" value="2">2 <input type="radio" name="test"value="3">3 <input type="radio" name="test" value="4">4 <input type="radio" name="test" value="5">5 </div> <button onclick="notify()"> Check </button>