Jquery 如何将数据价格值从多个复选框求和到现有函数？_Jquery_Function_Checkbox_Sum

Jquery 如何将数据价格值从多个复选框求和到现有函数？

jquery function checkbox

Jquery 如何将数据价格值从多个复选框求和到现有函数？,jquery,function,checkbox,sum,Jquery,Function,Checkbox,Sum,我试图在html表单中添加多个可选复选框，这样，如果选中，复选框的数据价格值将添加到总和中问题是，我只能将第一个选中的checbox添加到其他输入类型中，而不能同时添加这两种类型。任何帮助都会非常好 <body> <form id="form1"> <div id=go> <label><input type="radio" name="colorRadio" v

我试图在html表单中添加多个可选复选框，这样，如果选中，复选框的数据价格值将添加到总和中

问题是，我只能将第一个选中的checbox添加到其他输入类型中，而不能同时添加这两种类型。任何帮助都会非常好

<body>

<form  id="form1">

<div id=go>
     <label><input type="radio" name="colorRadio" value="one" class="abc" data-price="1600">Live Band</label>
        <label><input type="radio" name="colorRadio" value="two" class="abc" data-price="400">DJ</label>
        <label><input type="radio" name="colorRadio" value="three" class="abc" data-price="500">Acoustic</label>
</div>


                         
                         
      <div id="example" class="container">  
            
            
           
          
            <select id="place">
                <option value="">pick</option>
                <option value="a" data-price="100" >a</option>
                <option value="b" data-price="200">b</option>
                <option value="c" data-price="300">c</option>
            </select>   
                           
      

            </div>      
            
            <div id="checker">
            <input type="checkbox" name="add-ons" id="add-dj" data-price="750">
            <input type="checkbox" name="add-ons" id="add-acoustic-wedding-music" data-price="450">
            </div>
</form>
            
        
        <div id="result" class="container"></div>


现场乐队
流行音乐播音员
声学的
挑选
A.
B
C

$（文档）.ready（函数（）{
函数验证（）{
var总和=0；
总和+=+$（“#进入输入：选中”）。数据（'price'）| 0；
总和+=+$（“#放置选项：选定”）。数据（'price'）| 0；
总和+=+$（“#检查输入：已检查”）。数据（'price'）| 0；
$（'#result'）.html（sum==0？''：sum+'$）；
}
验证（）；
$（“#go输入，#place，#checker输入”）.on（'change'，function（）{
验证（）；
});
});

您可以使用每个循环循环通过

选中的复选框，然后可以使用$（this）.data（'price'）
并将其添加到总和中
演示代码：

$（文档）.ready（函数（）{
函数验证（）{
var总和=0；
总和+=+$（“#进入输入：选中”）。数据（'price'）| 0；
总和+=+$（“#放置选项：选定”）。数据（'price'）| 0；
//循环通过复选框
$（“#检查器输入：选中”）。每个（函数（）{
sum+=+$（this）.data（'price'）//获取数据价格外接程序sum
})
$（'#result'）.html（sum==0？''：sum+'$）；
}
验证（）；
$（“#go输入，#place，#checker输入”）.on（'change'，function（）{
验证（）；
});
});

现场乐队
流行音乐播音员
声学的
挑选
A.
B
C
您可以使用每个循环循环通过选中的复选框，然后可以使用$（this）.data（'price'）
并将其添加到总和中
演示代码：

$（文档）.ready（函数（）{
函数验证（）{
var总和=0；
总和+=+$（“#进入输入：选中”）。数据（'price'）| 0；
总和+=+$（“#放置选项：选定”）。数据（'price'）| 0；
//循环通过复选框
$（“#检查器输入：选中”）。每个（函数（）{
sum+=+$（this）.data（'price'）//获取数据价格外接程序sum
})
$（'#result'）.html（sum==0？''：sum+'$）；
}
验证（）；
$（“#go输入，#place，#checker输入”）.on（'change'，function（）{
验证（）；
});
});

现场乐队
流行音乐播音员
声学的
挑选
A.
B
C
Happy to help.：）您可以通过单击该勾号来接受此答案。Happy to help.：）您可以通过单击该勾号来接受此答案。
<script>  $(document).ready(function(){
             function validate() {
    var sum = 0;
    sum += +$('#go input:checked').data('price') || 0;
    sum += +$('#place option:selected').data('price') || 0;
    sum += +$('#checker input:checked').data('price') || 0;

    $('#result').html(sum === 0 ? '' : sum + '$');
  }
  validate();

  $('#go input, #place, #checker input').on('change', function() {
    validate();
        });
         
    });
        </script>
        </body>