Question

我有5组单选按钮，set1，set2，set3，set4，set5。每个值都为是/否。

我需要在隐藏的文本框中显示yes的数量。即1,2,3,4或5，并且当人们选择不同的选项时显然会改变..

<input type="radio" name="set1" id="set1_no" value="no">
<input type="radio" name="set1" id="set1_yes" value="yes">

<input type="radio" name="set2" id="set2_no" value="no">
<input type="radio" name="set2" id="set2_yes" value="yes">

<input type="radio" name="set3" id="set3_no" value="no">
<input type="radio" name="set3" id="set3_yes" value="yes">

<input type="radio" name="set4" id="set4_no" value="no">
<input type="radio" name="set4" id="set4_yes" value="yes">

<input type="radio" name="set5" id="set5_no" value="no">
<input type="radio" name="set5" id="set5_yes" value="yes">


<input type="hidden" name="number_of_yes" value="" readonly="readonly">

Answer 1

鉴于你正在设置一个隐藏字段（顺便说一下，它不需要只读，因为它......好......隐藏）我可能只会更新它onsubmit <form>。如果您确实需要更新它，请使用onclick或onchange代替。无论你触发它，你都可以尝试这样的事情：

yourForm.onsubmit = setYesCount;

function setYesCount() {
  var count = 0;

  // could use yourForm.getElementsByTagName(),
  // but since the OP didn't provide surrounding HTML:
  var els = document.getElementsByTagName("input");
  for (var i=0; i < els.length; i++) {
    if (els[i].type === "radio" && els[i].checked && els[i].value === "yes")
      count++;
  }
  // add an id attribute to the hidden input
  // for the following to work
  document.getElementById("number_of_yes").value = count;
}

（如果我不说其他人会：你可以用jQuery在一行或两行中做到这一点。）

编辑：jQuery版本 - 我再次把它放在表单的提交事件上（我假设你有一个表单并且可以填写id）。如果需要，您可以将其更改为更改或单击事件。

$(document).ready(function() {
  $("#yourFormsId").submit(function() {
         $('input[name="number_of_yes"]').val(
            $('input:checked[type="radio"][value="yes"]').length);
  });
});

Answer 2

只要单击“否”或“是”，您就可以使用javascript维护计数器变量。为所有NO和YES按钮定义一个类

我想像这样做

var ctr = 0;
$(document).ready( function($) {
     $(".noradio").click((function () {
                 if (ctr != 0)
                 {
                     ctr--;
                 }
           })
     $(".yesradio").click()(function () {
                     ctr++;
           })
     $('input[name=hiddeninputname]').val(ctr);
});

添加选中的单选按钮数量（在php / js中）

2 个答案: