jQuery实现多下拉框选中项money属性值求和遇NaN问题求助

错误根源 #

你代码里的$(this).attr('money')是直接给<select>元素获取money属性，但**money属性是定义在选中的<option>标签上，不是<select>本身**，所以会返回undefined，强制转成数字后就变成了NaN，最终求和结果也是NaN。

修正后的代码 #

$(function () {
    var fields = $('.product-custom-option.admin__control-select').change(calculate);
    function calculate() {
        var pricesum = 0;
        fields.each(function () {
            // 找到当前select下选中的option
            var selectedOption = $(this).find('option:selected');
            // 获取money属性值，为空或不存在时默认取0
            var moneyVal = selectedOption.attr('money') || 0;
            // 转成数字后累加
            pricesum += +moneyVal;
        })
        $('.outputdiv').html(pricesum.toFixed(2));
    }
})

额外说明 #

• 加入了|| 0的处理，当选中默认的-- Please Select --选项时（该option没有money属性），会默认取0，避免再次出现NaN。
• +moneyVal是把字符串类型的属性值强制转换成数字，确保累加运算正常。

内容的提问来源于stack exchange，提问作者alanjson