javascript - 如何从之前选择的 radio 中获取值？

Question

在我的例子中，我有几行单选框，每个单选框都有一个值。必须计算此值并将结果放在 DIV 中。

我的问题是，我找不到一种方法来减去之前选择的radion 的值。让我向您展示一个示例标记:

<table>
      <tr>
        <td><input name="tools" value="20" type="radio"></td>
        <td><input name="tools" value="300" type="radio"></td>
        <td><input name="tools" value="1000" type="radio"></td>
     </tr>
     <tr>
       <td><input name="addons" value="5" type="radio"></td>
       <td><input name="addons" value="10" type="radio"></td>
     </tr>
</table>
<div id="result"></div>

JavaScript:

var radioClick   = $('input[type="radio"]');

radioClick.on('change', function(evt){

      // function sub or add the price... 
      // here is a shortcut of the add calc version...
      var price = $(this).val(),
      showPrice = $('#result').text(),
      endresult = parseFloat(showPrice) + parseFloat(price),
      $('#result').text(endResult);
});

对于复选框，它工作正常，但如果是 radioboyes，我没有点击事件来识别它，我必须减去。

在第一行我们看到 radio name=tools。在这里，我首先取这个值为 20 的。之后 #result 中会显示值 20，很好。但是当我现在使用另一个 radio name=tools 时，新值将添加到 20。这就是我的问题。我不知道如何找到之前选择的单选按钮来获取这个值并减去它。

Answer 1

尝试使用这个:html代码:

<table>
  <tr>
    <td><input name="tools" class="test1" value="20" type="radio"></td>
    <td><input name="tools" class="test1" value="300" type="radio"></td>
    <td><input name="tools" class="test1" value="1000" type="radio"></td>
 </tr>
 <tr>
   <td><input name="addons" class="test" value="5" type="radio"></td>
   <td><input name="addons" class ="test" value="10" type="radio"></td>
 </tr>

JavaScript:

<script>

var testPrice  = 0;
var test1Price = 0;
var endprice = 0;
var price ='';
 $('.test').click(function(){
 price = $(this).val();
 testPrice = price;
 endPrice = parseFloat(testPrice) + parseFloat(test1Price),

  $('#result').text(endPrice);
 });
 $('.test1').click(function(){
 var price = $(this).val();
  test1Price = price;
   endPrice = parseFloat(testPrice) + parseFloat(test1Price),
  $('#result').text(endPrice);
  });


   </script>

在 http://jsfiddle.net/rxrzX/ 上试用它的演示