計算 HTML 中選中的復選框的數量
[英]Count the number of checked checkboxes in HTML
問題描述
所以基本上我想計算被勾選的復選框的數量。 我讓我的代碼達到了成功計數的程度，但我想放入一個警報，顯示勾選的復選框數量，代碼執行此操作但不顯示總數，它會在每次刷新時增加總數。 我只想知道如何顯示總數。
單擊單選按鈕“是”時，它應該顯示總數。
<br />Apples
<input type="checkbox" name="fruit" />Oranges
<input type="checkbox" name="fruit" />Mango
<input type="checkbox" name="fruit" />
<br />Yes
<input type="radio" name="yesorno" id="yes" onchange="checkboxes()"
function checkboxes(){
var inputElems = document.getElementsByTagName("input"),
count = 0;
for (var i=0; i<inputElems.length; i++) {
if (inputElems[i].type === "checkbox" && inputElems[i].checked === true){
count++;
alert(count);
}
}}
7 個解決方案
解決方案1
48 2014-04-08 13:37:53
這應該可以解決問題：
alert(document.querySelectorAll('input[type="checkbox"]:checked').length);
解決方案2
21 2014-04-08 13:21:16
使用 jquery 試試這個
方法一：
alert($('.checkbox_class_here :checked').size());
方法二：
alert($('input[name=checkbox_name]').attr('checked'));
方法：3
alert($(":checkbox:checked").length);
解決方案3
6 2014-04-08 13:29:07
試試這個代碼
<br />Apples
<input type="checkbox" name="fruit" checked/>Oranges
<input type="checkbox" name="fruit" />Mango
<input type="checkbox" name="fruit" />
<br />Yes
<input type="radio" name="yesorno" id="yes" onClick="checkboxes();" />
Javascript
function checkboxes()
{
var inputElems = document.getElementsByTagName("input"),
count = 0;
for (var i=0; i<inputElems.length; i++) {
if (inputElems[i].type == "checkbox" && inputElems[i].checked == true){
count++;
alert(count);
}
}
}
解決方案4
5 2015-09-11 04:45:45
感謝馬龍·伯納德斯 (Marlon Bernardes)。 alert(document.querySelectorAll('input[type="checkbox"]:checked').length);
如果您有多個表單，每個表單的復選框名稱不同，上面的代碼將計算所有表單中的所有復選框。
為了解決這個問題，您可以修改它以按名稱隔離。
var le = document.querySelectorAll('input[name="chkboxes[]"]:checked').length;
解決方案5
3 2015-11-18 07:25:24
最初的代碼幾乎是正確的。 行警報（計數）； 是在錯誤的地方。 它應該出現在第二個右括號之后，如下所示：-
function checkboxes()
{
var inputElems = document.getElementsByTagName("input"),
count = 0;
for (var i=0; i<inputElems.length; i++) {
if (inputElems[i].type == "checkbox" && inputElems[i].checked == true){
count++;
}
}
alert(count);
}
在錯誤的地方，它會為您提供每個選中框的警報消息。
解決方案6
1 2014-04-08 13:31:56
var checkboxes = document.getElementsByName("fruit");
for(i = 0 ; i<checkboxes.length; i++)
{
if(checkboxes[i].checked==0){checkboxes.splice(i,1);}
}
alert("Number of checked checkboxes: "+checkboxes.length);
解決方案7
0 2021-06-07 08:05:16
function checkboxes(){ var inputs = document.getElementsByTagName("input"); var inputObj; var selectedCount = 0; for(var count1 = 0;count1<inputs.length;count1++) { inputObj = inputs[count1]; var type = inputObj.getAttribute("type"); if (type == 'checkbox' && inputObj.checked) { selectedCount++; } } alert(selectedCount); }
<html> <body>Fruits <br /> <input type="checkbox" name="fruit" checked/>Oranges <input type="checkbox" name="fruit" />Mango <input type="checkbox" name="fruit" />Apple <br />Yes <input type="radio" name="yesorno" id="yes" onClick="checkboxes();"/> </body> </html>
javascript / jquery來計算當前行中已選中復選框的數量
[英]javascript / jquery to count number of checked checkboxes in current row
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.