简体   繁体   English

如何使用jQuery / JavaScript查找单选按钮值的总和?

[英]How to find a total sum of radio button values using jQuery/JavaScript?

I have found following tutorial and applied it to my code How to sum radio button values using either Javascript or jQuery? 我找到了以下教程并将其应用于我的代码如何使用Javascript或jQuery求和单选按钮值? but it didn't work for me. 但这对我没有用。 A user has a choice of a plan and upon his/her wish can download a personalized logo for $49.99. 用户可以选择计划,并且可以根据自己的意愿下载个性化徽标,价格为49.99美元。 I wanted the price for a logo either $49.99 if yes, or $0.00 if no, to add to the choice of a plan, and have an output of a total price. 我希望徽标的价格为$ 49.99(如果是)或$ 0.00(如果不是),以增加对计划的选择,并输出总价。 However, the code in the previous tutorial that I have posted link to had worked, but what am I doing wrong in my code? 但是,我以前发布的链接中的代码已起作用,但是我的代码在做什么错呢?

Fiddle http://jsfiddle.net/1s4gzbys/4/ 小提琴http://jsfiddle.net/1s4gzbys/4/

<div class="control-group questions">
   <div class="field-control">
     <p>Would you like to download your company logo?</p>
        <div class="input-wrapper">
            <div class="answer"><input class="btn-checkbox-choice" type="radio" name="groupeight" value="$49.99"/><label>Yes</label></div>
<input class="btn-checkbox-choice" type="radio" name="groupeight" value="$0.00" /><label>No</label>
           </div>
       </div>
 </div>
 <span id="checkout-title">Checkout</span>
    <div class="plan-wrapper">
      <label id="silver-plan"><input class="btn-checkbox-plan"  type="radio" name="groupnine" value="$699"  /><label>Silver Plan</label><span id="silver-plan-price">$699</span>   </label>
      <label id="gold-plan"><input class="btn-checkbox-plan" type="radio" name="groupnine" value="$999" /><label>Gold Plan</label><span id="gold-plan-price">$999</span></label>                
    </div>
    <div class="logo-wrapper">
      <span id="personalized-logo">Personalized Logo</span>
        <output type="number" name="price" id="output-choice">
    </div>
    <div class="total-wrapper">
        <div class="wrapper-b">
            <span id="total">Total</span>
                <output type="number" name="price" id="output"></output>
        </div>
    </div>

.js .js文件

 $(document).ready(function(){

 $('input').iCheck({
   checkboxClass: 'icheckbox_square-blue',
   radioClass: 'iradio_square-blue',
   increaseArea: '20%' // optional
});

  // $('input').on('ifChecked', function(event){});
       function calcprice() {
        var sum = 0;
    if(($(".btn-checkbox-choice").is(':checked')) && ($(".btn-checkbox-  plan").is(':checked'))).each(function(){
        sum += parseInt($(this).val(),10);
     });
      $("output[name=price]").val(sum);
     }
     $().ready(function(){
     $("#output").change(function(){
    calcprice()
    });

    });
 });

Your are able to do the following: 您可以执行以下操作:

$(document).ready(function(){
     $("input[type=radio]").change(function(){
         if ($("input[name=groupnine]:checked").val() && $("input[name=groupeight]:checked").val()){
             p1 = $("input[name=groupnine]:checked").val().substring(1)*1;
             p2 = $("input[name=groupeight]:checked").val().substring(1)*1;
             $("#output").val("$"+(p1+p2));
         }
         else{
             //alert('no')
         }
      // alert($(this).val());
     })
});

Check this DEMO: http://jsfiddle.net/1s4gzbys/15/ 检查此演示: http : //jsfiddle.net/1s4gzbys/15/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM