Javascript 使用jQuery从两个输入表单计算值

我正在尝试添加级别1和级别2的分数，并在

中显示结果

到目前为止，这是我所做的，但它不仅不适用于所有的输入，而且看起来像一团乱，我认为这不是解决我试图实现的目标的正确方法。我已经重复了几乎相同的事情，一次又一次，应该有一个更简单和诗意的写作方式

我非常感谢你的建议我怎样才能写得更好

$（文档）.ready（函数（）{
$（文档）.on（“输入”，函数（）{
FScore=0；
if（document.getElementById（“1”）已选中）{
分数=FScore+1；
}
if（document.getElementById（“2”）已选中）{
分数=FScore+2；
}
if（document.getElementById（“3”）已选中）{
分数=FScore+3；
}
if（选中document.getElementById（“4”））{
分数=FScore+4；
}
如果（选中document.getElementById（“5”））{
分数=FScore+5；
}
if（选中document.getElementById（“6”））{
分数=FScore+6；
}
if（选中document.getElementById（“7”））{
分数=FScore+7；
}
if（选中document.getElementById（“8”））{
分数=FScore+8；
}
$（'#score'）.html（score）；
})
$（“#1”）。触发器（“输入”）；
});
form{
位置：相对位置；
顶部：100px；
左：100px；
背景：-webkit线性梯度（底部，#eaeaea，#FAFA）；
填充：10px；
显示：内联块；
盒影：0 1px 1px rgba（0,0,0,65）；
边界半径：3px；
边框：实心1px#ddd；
}
输入{显示：无；}
输入：选中+标签{
背景：-webkit线性梯度（顶部，#4D90FE，#4787ED）；
边框：实心1pxRGBA（0,0,0,15）；
颜色：白色；
盒影：0 1px 1px rgba（0,0,0,65），0 1px 0 rgba（255255,1）插图；
文本阴影：0-1px0RGBA（0,0,0,6）；
}
标签{
字体系列：helvetica；
光标：指针；
显示：内联块；
边框：实心1px透明；
右边距：2px；
宽度：50px；
高度：40px；
文本对齐：居中；
线高：40px；
边界半径：3px；
}
标签：最后一个子项{右边距：0；}
标签：悬停{
背景：rgba（77144254.5）；
边框：实心1pxRGBA（0,0,0,15）；
}

一级：

1.
2.
3.
4.
第二级：

5.
6.
7.
8.
结果:
更简单的方法如下：


$（文档）.ready（函数（）{
$（“输入”）.change（函数（）{
$（'#score'）.html（+$（'input[name=“first”]：checked'）.val（）++$（'input[name=“second”]：checked'）.val（））；
})
美元（“#1”）。触发（“更改”）；
});
form{
位置：相对位置；
顶部：100px；
左：100px；
背景：-webkit线性梯度（底部，#eaeaea，#FAFA）；
填充：10px；
显示：内联块；
盒影：0 1px 1px rgba（0,0,0,65）；
边界半径：3px；
边框：实心1px#ddd；
}
输入{显示：无；}
输入：选中+标签{
背景：-webkit线性梯度（顶部，#4D90FE，#4787ED）；
边框：实心1pxRGBA（0,0,0,15）；
颜色：白色；
盒影：0 1px 1px rgba（0,0,0,65），0 1px 0 rgba（255255,1）插图；
文本阴影：0-1px0RGBA（0,0,0,6）；
}
标签{
字体系列：helvetica；
光标：指针；
显示：内联块；
边框：实心1px透明；
右边距：2px；
宽度：50px；
高度：40px；
文本对齐：居中；
线高：40px；
边界半径：3px；
}
标签：最后一个子项{右边距：0；}
标签：悬停{
背景：rgba（77144254.5）；
边框：实心1pxRGBA（0,0,0,15）；
}

一级：

1.
2.
3.
4.
第二级：

5.
6.
7.
8.
结果:
请注意，HTML ID不能以数字开头。（我想这不是阻止问题，但很高兴知道）

试试这个：

$(document).on("change", "form", function() {

  var result = 0;

  $("input:checked").each(function() {
    result += Number($(this).val());
  })

  $("#score").html(result)

});

你所有的
Score=FScore+…
语句不都应该是
FScore=FScore+…
？还要注意的是，你似乎在
Score=Score+5中有一个拼写错误根据您的其他规则，因此，您不需要检查每个收音机是否已检查。您为它们指定了相同的名称，因此可以执行类似于
$（'.first'）.filter（':checked'）.val（）的操作。使用处的答案获取表单值，然后将它们添加到一起。你可能也不想要两种形式。哇！谢谢你的建议。这看起来很整洁。但是您是否注意到了这样一个问题：当我从第二级选择任何其他内容时，我无法再次选择
5
？非常感谢您的教训@j08691@dvd看到和