Jquery多个复选框在var中获取值或在span中打印
html的代码是:
Add-ons
Add-on Number 1 - 10 QR
Add-on Number 2 - 20 QR
Add-on Number 3 - 40 QR
Add-on Number 4 - 60 QR
I want more add-ons 0 1 2 3 User total usage:
jQuery的:
//For select function displayVals() { var singleValues = $("#more").val(); $("#span").html("more addons: " + singleValues); } $("select").change(displayVals); displayVals(); //For checkboxes var $cbs = $('input[name="ch1"]'); $cbs.click(function() { var total = 0; $cbs.each(function() { if (this.checked) var singleValues = $("#more").val(); total += +this.value + singleValues; }); $("#usertotal").text(total); });
我想要用户总使用量:创建复选框的总和并添加选项的值,这样如果我选择1复选框和2加选项1,我将写入用户总使用量:60。 先感谢您 !
工作演示: http : //jsfiddle.net/GNDAG/
希望能帮助到你。 您可以在这里阅读更多相关信息。
但是,就像@nnnnnn提到的那样,你的html不对 – ID属性需要是唯一的。
码
$('input[type="checkbox"]').change(function() { var total_span = 0; $('input[type="checkbox"]').each(function() { if ($(this).is(':checked')) { total_span += parseInt($(this).prop('value'), 10); } }); $("#usertotal").html(total_span); });
请注意,对多个元素使用相同的id是无效的html。 使用其name属性选中复选框。 单击任何复选框循环遍历所有,并添加任何已选中的值。 请注意,值需要转换为数字,我使用一元加运算符。
var $cbs = $('input[name="ch1"]'); $cbs.click(function() { var total = 0; $cbs.each(function() { if (this.checked) total += +this.value; }); $("#usertotal").text(total); });
演示: http : //jsfiddle.net/6GX7g/
干得好:
工作演示jsfiddle
HTML:
Add-ons
Add-on Number 1 - 10 QR
Add-on Number 2 - 20 QR
Add-on Number 3 - 40 QR
Add-on Number 4 - 60 QR
User total usage:
jQuery的/ JavaScript的:
var getCheckedBoxValues = function() { var values = [] $(".numbers:checked").each(function() { values.push($(this).val()); }); return values; }; $('.numbers').click(function () { $('#usertotal').html(); var usertotal = 0; var values = getCheckedBoxValues(); for(i = 0; i < values.length; i++) { usertotal += parseInt(values[i]); } $('#usertotal').html(usertotal); });
try it: $('input:checkbox').change(function(){ var tot=0; $('input:checkbox:checked').each(function(){ tot+=parseInt($(this).val()); }); $('#usertotal').html(tot) });