Question

我想计算选中的复选框并在Div中显示计数。

这是我的HTML：

<form name="liste_figurine" method="post">

<input type="checkbox" id="radio-1" class="z" name="chck1[]" onclick="updateCount()" />
<input type="checkbox" id="radio-2" class="z" name="chck2[]" onclick="updateCount()" />

</form>

<div id="y"></div>

这是我的JS：

function updateCount {
    var x = $(".z:checked").length;
    document.getElementById("y").innerHTML = x;
};

这是一个例子：https://jsfiddle.net/r3todbs6/3/

抱歉，我不习惯JS ......我的代码出了什么问题？

最后，它有效，但我有最后一个问题：onclick必须包含2个函数，而我无法让它们协同工作。

现在这个功能单独使用：onclick="updateCount()"

这个其他功能也可以单独使用：onclick="document.getElementById(\'radio-'.$ligne['id'].'-2\‌').c‌hecked = false"

但这两个功能并不起作用： onclick="updateCount(); fx2(document.getElementById(\'radio-'.$ligne['id'].'-1\').ch‌ecked = false);"

第三个命题有什么问题？这是语法错误吗？

Answer 1

window.updateCount = function() {
    var x = $(".z:checked").length;
    document.getElementById("y").innerHTML = x;
};

https://jsfiddle.net/73yfczcj/

试试这个。你必须在javascript设置中使用jquery。

Answer 2

function updateCount {
    var x = document.querySelector('.z:checked').length;
    document.getElementById("y").innerHTML = x;
};

如果您不想使用jQuery

，请尝试此功能

Answer 3

使用长度

private void button1_Click(object sender, System.EventArgs e)
{
   listBox1.Items.Add("Sally");
   listBox1.Items.Add("Craig");
}

private void button2_Click(object sender, System.EventArgs e)
{
   listBox1.Items.Clear();
}

Answer 4

您的小提琴代码有三个问题：

正如其他人所说，它应该是length，而不是size()。
您应该更改JavaScript设置 - ＆gt;将类型加载到“No wrap-in <head>”。否则，updateCount未在全局范围内定义。
如果您使用原始代码，则需要将Fiddle配置为使用jQuery。

一个工作示例：https://jsfiddle.net/c5ez4w7y/

Answer 5

康苏提供的答案是最好的答案，但这就是我的表现。

＆＃13;

var form = document.getElementById('form');
var checkBoxes = $(form).children('.checkbox');
var count = 0;

var divBoxesChecked = document.getElementById('boxesChecked');
divBoxesChecked.innerHTML = 0;

$(checkBoxes).on('click', function() {
  $.each(checkBoxes, function(i) {
    if (checkBoxes[i].checked) {
      count++;
    }
  });
  console.log(count);
  divBoxesChecked.innerHTML = count;
  count = 0;
});

＆＃13;

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<form id="form" method="post">

  <input type="checkbox" id="box_01" class="checkbox" name="box_01" />
  <label>Box 1</label>

  <input type="checkbox" id="box_02" class="checkbox" name="box_02" />
  <label>Box 2</label>

  <input type="checkbox" id="box_03" class="checkbox" name="box_03" />
  <label>Box 3</label>

</form>

<div id="boxesChecked"></div>

＆＃13;

基本上，每次单击其中一个框时，它会计算总共检查了多少个框并将其打印到div和控制台，然后将计数器重置为零，因为它会重新计算所有选中的框每次你点击一个。

如何使用Javascript计算选中的复选框？

5 个答案: