使用 javascript 添加和乘以单选按钮值

Adding and Multiplying Radio button values with javascript

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

我有一个调查表，我开发并放在jsfiddle http://jsfiddle.net/tMUJT/

$('input:radio').change(function(){ 
  var tot=0;
  $('input:radio:checked').each(function(){
    tot+=parseInt($(this).val());
  });
  tot+=parseInt($('#more').val());
    $('#usertotal').html(tot)
  });
  $('#more').change(function(){
    $('input:radio').trigger('change');
});

每个无线电输入的值为 1。

我需要在每列下方显示每列的总和，然后根据以下计算显示最终总和：

列 1 总计 x 0 + 列 2 总计 x 1 + 列 3 总计 x 2 + 列 4 总计 x

3 + 列 5 总计 x 4 =

我尝试重新利用许多脚本，但就是无法让它工作 - 我的 js 技能不是那么好。如果有人能帮我让它在jsfiddle中工作，我将不胜感激。谢谢！

http://jsfiddle.net/3qh8D/1/

我喜欢将html5数据属性用于此类事情。你可以随心所欲地称呼它，但我使用了data-factor（实际上weight会更有意义）。我认为最好将其放入标记中。这样，当您生成标记时，您可以将要查找的值直接绑定到 HTML 中，而不是在代码中的某个地方进行某种映射，上面写着"这个 css 类等于 1，这个 css 类等于 2"等。 

<td bgcolor="#00CC66"><input type="radio" data-factor='1' name="checkbox" id="checkbox1" value="1"></td>
<td>On shelf</td>
<td bgcolor="#FFFF33"><input type="radio" data-factor='2' name="checkbox" id="checkbox2" value="1"></td>
<td>No</td>
<td bgcolor="#fba459"><input type="radio" data-factor='3' name="checkbox" id="checkbox3" value="1"></td>
<td class="dots">&nbsp;</td>

然后，每当其中一个单选按钮发生变化时，您只需滚动所有选中的输入并将data-factor值相加。 

// column1 total x 0 + column2 total x 1 + column3 total x 2 + column4 total x 3 + column5 total x 4 =
$(':input[type=radio]').change(function() {
  var $inp, factor, inp, inputs, total, _i, _len;
  total = 0;
  inputs = $('input[type=radio]:checked');
  for (_i = 0, _len = inputs.length; _i < _len; _i++) {
    inp = inputs[_i];
    $inp = $(inp);
    factor = $inp.attr('data-factor') || 0;
    total += +factor;
  }
  return $('#totalValue').text("Total value:" + total);
});

（小提琴在咖啡脚本中，因为我发现它更具可读性）

相关文章：