Javascript 如何从之前选择的收音机中获取值？

在我的例子中，我有几行收音机盒，每个收音机都有一个值。必须计算此值并将结果放入DIV中

我的问题是，我以前找不到减去choosen 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>

使用复选框可以很好地工作，但是对于radioboyes，我没有单击事件来识别它，我必须减去

在第一行中，我们看到收音机

name=tools

。这里我首先取这个值为20的。

---

之后，值20将显示在

#结果中，很好。但是，当我现在使用另一个收音机时，新的值将添加到20。这就是我的问题。我不知道如何找到before selected单选按钮来获取此值并将其减去。
您不需要进行减法运算。您只需找到2 diff单选按钮的2个值：
tools
和
addons
。然后只需添加它们并写入
div



您可以通过以下方式获取单选按钮值：

$('input[name=radioName]:checked').val();

我想试试这个：

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 toolsprice = $('input[name=tools]:checked').val(),
      var addonsprice = $('input[name=addons]:checked').val(),
      endresult = parseFloat(toolsPrice) + parseFloat(addonsprice),
      $('#result').text(endResult);
});

你不需要减法。您只需找到2 diff单选按钮的2个值：
tools
和
addons
。然后只需添加它们并写入
div



您可以通过以下方式获取单选按钮值：

$('input[name=radioName]:checked').val();

我想试试这个：

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 toolsprice = $('input[name=tools]:checked').val(),
      var addonsprice = $('input[name=addons]:checked').val(),
      endresult = parseFloat(toolsPrice) + parseFloat(addonsprice),
      $('#result').text(endResult);
});

您可以使用对象文字来跟踪值，使用闭包：

radioClick.on('change', (function()
{
    var valTracker = {},
    resultDiv = $('#result');//easier on the DOM
    return function(evt)
    {
        valTracker[this.name] = valTracker[this.name] || 0;//get old value
        var endResult = parseFloat(resultDiv.text()) + parseFloat($(this).val()) - valTracker[this.name];//subtract old value, too
        valTracker[this.name] = parseFloat($(this).val());//set current value
        resultDiv.text(endResult);
    }
}()));

valTracker
对象文字跟踪当前的无线电值（元素的名称用作属性）。我还在闭包中保留了对
$（'#result'）
div的引用。这样，您就不必每次调用回调函数时都查询DOM
 您可以使用对象文字跟踪值，使用闭包：

radioClick.on('change', (function()
{
    var valTracker = {},
    resultDiv = $('#result');//easier on the DOM
    return function(evt)
    {
        valTracker[this.name] = valTracker[this.name] || 0;//get old value
        var endResult = parseFloat(resultDiv.text()) + parseFloat($(this).val()) - valTracker[this.name];//subtract old value, too
        valTracker[this.name] = parseFloat($(this).val());//set current value
        resultDiv.text(endResult);
    }
}()));

valTracker
对象文字跟踪当前的无线电值（元素的名称用作属性）。我还在闭包中保留了对
$（'#result'）
div的引用。这样，您就不必每次调用回调函数时都查询DOM
 尝试使用以下方法：
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>


var-testPrice=0；
var test1Price=0；
var endprice=0；
var价格=“”；
$（'.test'）。单击（函数（）{
价格=$（this.val（）；
测试价格=价格；
endPrice=parseFloat（testPrice）+parseFloat（test1Price），
$（“#结果”）.text（endPrice）；
});
$（'.test1'）。单击（函数（）{
var price=$（this.val（）；
test1价格=价格；
endPrice=parseFloat（testPrice）+parseFloat（test1Price），
$（“#结果”）.text（endPrice）；
});

在
上尝试它的演示使用以下方法：
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>


var-testPrice=0；
var test1Price=0；
var endprice=0；
var价格=“”；
$（'.test'）。单击（函数（）{
价格=$（this.val（）；
测试价格=价格；
endPrice=parseFloat（testPrice）+parseFloat（test1Price），
$（“#结果”）.text（endPrice）；
});
$（'.test1'）。单击（函数（）{
var price=$（this.val（）；
test1价格=价格；
endPrice=parseFloat（testPrice）+parseFloat（test1Price），
$（“#结果”）.text（endPrice）；
});

试一下它的演示版。
试着使用下面的代码：

即使您添加了更多单选按钮组，这也会起作用。如果只想为特定组使用此功能，请在数组中定义名称，而不是从文档中获取名称。
尝试使用以下代码：

即使您添加了更多单选按钮组，这也会起作用。如果您只想为特定组使用此功能，请在数组中定义名称，而不是从文档中获取名称。
如果要减去已存在的值，为什么要首先添加该值？只需用新值覆盖文本字段。也许我误解了你的目的，但不要这样做‘endresult=parseFloat（showPrice）+parseFloat（price）’‘do’endresult=parseFloat（price）’首先，我选择值为20的收音机，结果中将显示20。然后我选择值为300的收音机。此时该怎么办？您希望在结果中显示什么？300+20或300-20或300？如果你想减去已经存在的值，为什么首先要加上它？只需用新值覆盖文本字段。也许我误解了你的目的，但不要这样做‘endresult=parseFloat（showPrice）+parseFloat（price）’‘do’endresult=parseFloat（price）’首先，我选择值为20的收音机，结果中将显示20。然后我选择值为300的收音机。此时该怎么办？您希望在结果中显示什么？300+20或300-20或300？不，它不起作用，我有不止这两个。你点击一个收音机，它的名字不重要，它的值必须是calc，在#result中有给定的术语。不，它不起作用，我有不止这两个。单击一个收音机，它的名称无关紧要，并且该值必须是带有#result中给定术语的calc。