[英]How to get value of different checkboxes and calculate value of those checked checkboxes and show in the input field?
选中不同复选框的值时,我遇到了一些问题。 这是我的代码
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js"></script>
<script>
$(document).ready(function(){
$('input[type="checkbox"]').bind('click',function()
{
var waterdm = $('#waterdm').val();
$("#price").val(waterdm);
});
});
</script>
<p><input type="checkbox" id="waterdm" name="waterdm" value="10" />Water Damage</p>
<p><input type="checkbox" id="screendm" name="screendm" value="20" />Screen Damage</p>
<p><input type="checkbox" id="Chargerdm" name="Chargerdm" value="30" />Charger Damage</p>
<p><input type="checkbox" id="hdphdm" name="hdphdm" value="10" />Headphone Damage</p>
<p>
Calculated Price: <input type="text" name="price" id="price" />
</p>
我想要的是每当用户选中复选框时,我都需要获取这些值并显示每个复选框值的总和,该值将被检入另一个输入框。 这意味着我需要将每个复选框的值相加。当用户取消选中任何复选框时,该值应从该总数中减去。 我在jquery中没有足够的经验。 请帮我。
您将需要遍历chebox。 当您使用复选框进行交谈时, change
事件更有意义。
使用on
附加事件而不是bind
$(document).ready(function () {
// cache the inputs and bind the events
var $inputs = $('input[type="checkbox"]')
$inputs.on('change', function () {
var sum = 0;
$inputs.each(function() {
// iterate and add it to sum only if checked
if(this.checked)
sum += parseInt(this.value);
});
$("#price").val(sum);
});
});
$(document).ready(function () {
var waterdm = 0;
$('input[type="checkbox"]').bind('click', function (e) {
if (this.checked) {
waterdm += eval(this.value);
} else {
waterdm -= eval(this.value);
}
$("#price").val(waterdm);
});
});
尝试这个
$(document).ready(function(){
var waterdm=0;
$('input[type="checkbox"]').on('click',function()
{
waterdm = waterdm+parseInt($(this).val());
$("#price").val(waterdm);
});
});
您可以使用以下代码
$(document).ready(function(){
$('input[type="checkbox"]').click(function()
{
var val = 0;
$('input[type="checkbox"]:checked').each(function(){
val+=parseInt($(this).val());
});
$("#price").val(val);
});
});
如果要汇总所有选中的复选框,请尝试以下操作:
$('input[type="checkbox"]').bind('click',function()
{
var sum = 0;
$('input[type="checkbox"]:checked').each(function(){
var val = parseInt($(this).val());
sum += val;
});
$("#price").val(sum);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.