如何計算特定div JAVASCRIPT中的復選框

Question

我想提醒特定div中選中的復選框數量（而不是<head>的復選框！），這是代碼：

的HTML

<div class="changer">

<label><input id="mode" type="checkbox" name="mode" value="Mode"        onclick="mode()" />Mode</label><br />

<label><input id="map" type="checkbox" name="map" value="Map" onclick="map()"/>Map</label><br />

<label><input id="joueurs" type="checkbox" name="joueurs" value="Joueurs" onclick="joueurs()" />Joueurs</label><br />

<label><input id="points" type="checkbox" name="points" value="Points" onclick="points()" />Points</label><br />

</div>



</head>

<body>

<div id="text">

</div>

</body>

<button id="send" onclick="send()">Envoyer</button>

Java腳本

function joueurs() {
    if((document.getElementById("joueurs").checked == true)) {

            joueursall.style.display = 'inline';
            text.style.display = 'inline';
    }

            else {
                if((document.getElementById("mode").checked == true)) {
                    modeall.style.display = 'none';
                    document.getElementById('mode').checked = false;
                }
                joueursall.style.display = 'none';
                text.style.display = 'none';

            }

        }


document.getElementById("playerlist").addEventListener("change", function() {

var selected = this.value;
document.getElementById("text").innerHTML = "";
var html = '';
for (var i = 0; i < selected; i++) {
html += '<div class="grpjoueur"> <span class="sub-text">Player</span> <label><input type="checkbox" name="botbot" value="BOT"/>BOT</label </div>';
}
  document.getElementById("text").innerHTML = html;
});

這是Javascript，如果選中了Joueurs，則添加“ Joueurs”下拉列表，然后根據#text div中的下拉列表中選擇的數字，將X彈出一個復選框（包括復選框）

我嘗試了多種方法，但始終返回0或所有復選框...

Answer 1

在香草JS中，您可以使用querySelectorAll來查詢復選框，然后使用.length來獲取復選框的數量。

var checkboxes = document.querySelectorAll("input[type='checkbox']");
alert(checkboxes.length);

CodePen演示

如果您只想提醒已選中復選框的長度，則可以這樣查詢它們：

var checkedInputs = document.querySelectorAll("input:checked");
alert(checkedInputs.length);

CodePen演示

當您單擊按鈕時，它將提醒已選中的框數

如何計算特定div JAVASCRIPT中的復選框

問題描述

1 個解決方案

解決方案1
2 2017-07-30 22:30:18

如何計算特定div JAVASCRIPT中的復選框

問題描述

1 個解決方案

解決方案1 2 2017-07-30 22:30:18

解決方案1
2 2017-07-30 22:30:18