javascript - JQuery，计算2个价格，显示总数

Question

我想根据 2 个选定的单选按钮计算总价。这是我所拥有的：

单选按钮

html 输入类是票价

<td class='v2'><input type='radio' name='fare' value='STANDARD' id='rbt2'>625,06</td>
<td class='v2'><input type='radio' name='fare2' value='STANDARD' id='rbt9'>884,34</td>

$(document).ready(function(){
           $("#rbt, #rbt2, #rbt3, #rbt4, #rbt5, #rbt6, #rbt7").click(function(){
                $("#fare").html($(this).closest("td").text());
           });
       });

       $(document).ready(function(){
           $("#rbt8, #rbt9, #rbt10, #rbt11, #rbt12, #rbt13, #rbt14").click(function(){
                 $("#fare2").html($(this).closest("td").text()); 
           });
       });

jQuery计算器

$(document).ready(function(){

    //iterate through each radio and add keyup
    //handler to trigger sum event
    $(".fare").each(function() {

        $(this).keyup(function(){
            calculateTotal();
        });
    });

});

function calculateTotal() {

    var total = 0;
    //iterate through each radio and add the values
    $(".fare").each(function() {

        //add only if the value is number
        if(!isNaN(this.value) && this.value.length!==0) {
            total += parseFloat(this.value);
        }

    });
    //.toFixed() method will roundoff the final sum to 2 decimal places
    $("#total").html(total.toFixed(2));
}

html输出

<tr>
   <td class="sc2" id="fare"></td>
   <td>+</td>
   <td class="sc2" id="fare2"></td>
   <td>=</td>
   <td><span class="total">0</span></td>
 </tr>

总数未显示。非常感谢帮助。谢谢！

Answer 1

给你：

$(document).ready(function(){
    ...
    $(".fare").keyup(function(){
        calculateTotal(); <--- you don't need to use each() here.
    });

});

function calculateTotal() {
    ...
    $("#total").html(total.toFixed(2));
}

html输出

<tr>
   ...
   <td><span id="total">0</span></td> <---- change 'class' to 'id'
 </tr>

注意变化。