使用 JavaScript 在单独的组中添加单选按钮值

adding radio button values in separate groups using javascript

本文关键字：添加 单选按钮 JavaScript 单独 使用      更新时间：2023-09-26

>我有一个带有单选按钮的表单，我正在使用javascript循环并将所有单选按钮的总和返回到页面底部的输入元素。我正在使用的脚本是这个，它工作正常。

<script type="text/javascript">
function checkTotal() {
var radios = document.querySelectorAll('input[type=radio]'),
    sumField = document.querySelector('input[type=text]');
    var sum = 0;
    for (var i = 0, len = radios.length - 1; i <= len; i++) {
        if (radios[i].checked) {
            sum += parseInt(radios[i].value);
        }
    }
    sumField.value = sum;
}
</script>

这是我的表格 http://cognitive-connections.com/Prefrontal_Cortex_Questionnaire.htm

但是，我需要

构建另一个表单，其中不同组中有几个问题，我需要分别对每个组的总数求和，并相应地将它们发布到页面上相应的输入元素中。这是我的新表格 http://cognitive-connections.com/Prefrontal_Cortex_Questionnaire100913.htm

我不是一个高级的javascript用户，但对编程本身有很好的理解(我认为，哈哈(我的头脑告诉我，我应该能够简单地为每个不同的组声明一个唯一的var和一个唯一的元素来发布它的结果，并使用相同的循环(每个组都有正确的vars(为每个组。但是当我添加 [name="elements name"] 作为 document.querySelectAll 的标识符时，它只抓取具有该名称的元素，如果我将元素本身命名为相同的名称，则单选按钮会失去其固有属性，一次只允许每个问题选择一个单选按钮？我还尝试为每个组创建一个类 ID，并尝试将其用作 document.querySelectAll 中的标识符，但它似乎根本不起作用。任何帮助将不胜感激。

根据我对问题的理解，以下是我的答案。这是小提琴 http://jsfiddle.net/8sbpX/10/。

function enableQ(cls) {
  var ele = document.querySelectorAll('.' + cls)[0],
    ev = (document.addEventListener ? "#addEventListener" : "on#attachEvent").split('#');
  ele[ev[1]](ev[0] + "change", function () {
    var radios = ele.querySelectorAll('[type="radio"][value="1"]:checked').length;
    ele.querySelector('[type="text"]').value = radios;
  });
}
enableQ("rad-grp");
相关文章：