jquery 加法
jQuery 加法实现方法
在jQuery中实现加法运算通常涉及DOM元素值的获取、转换和计算。以下是几种常见场景的实现方式：
获取输入框值并相加
var num1 = parseFloat($('#input1').val());
var num2 = parseFloat($('#input2').val());
var sum = num1 + num2;
$('#result').text(sum);对多个同类元素求和
var total = 0;
$('.price').each(function() {
total += parseFloat($(this).text());
});
$('#totalPrice').text(total.toFixed(2));动态添加数值计算
$('.add-btn').click(function() {
var current = parseInt($('#counter').text());
$('#counter').text(current + 1);
});表单提交时计算
$('#calcForm').submit(function(e) {
e.preventDefault();
var x = parseInt($('#x').val());
var y = parseInt($('#y').val());
alert('计算结果: ' + (x + y));
});注意事项
- 使用
parseInt()或parseFloat()确保字符串转换为数值 - 处理空值和非数字输入的情况
- 浮点数计算注意精度问题
- 事件委托适用于动态添加的元素
扩展应用
结合jQuery UI可以实现滑动条数值相加等交互效果：
$('#slider1, #slider2').slider({
slide: function() {
var sum = $('#slider1').slider('value') + $('#slider2').slider('value');
$('#sliderSum').text(sum);
}
});
