Javascript 将文本区域中的值与select中的元素相乘并相加

不太容易解释，所以让我粘贴一点代码：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" ></script>
<script type="text/javascript">
    $(document).ready(function() {
        calculateSum();
         $(".txt").live("keydown keyup", function() {
            calculateSum();
         });
     });

     function calculateSum() {
        var sum = 0;
        // Iterate through each textboxes and add the values.
        $(".txt").each(function() {
            // Add only if the value is number.
            if (!isNaN(this.value) && this.value.length != 0) {
               sum += parseFloat(this.value);
            }
            else if (this.value.length != 0){
               $(this).css("background-color", "red");
            }
        });
        $("#currentCost").html(sum.toFixed(2));
     }
</script>

$（文档）.ready（函数（）{
计算um（）；
$（“.txt”）.live（“keydown-keyup”，function（）{
计算um（）；
});
});
函数calculateSum（）{
var总和=0；
//遍历每个文本框并添加值。
$（“.txt”）。每个（函数（）{
//仅当值为number时才添加。
如果（！isNaN（this.value）&&this.value.length！=0）{
sum+=parseFloat（此.value）；
}
else if（this.value.length！=0）{
$（this.css（“背景色”、“红色”）；
}
});
$（“#currentCost”）.html（sum.toFixed（2））；
}

首先，我想更新代码以使用最新版本的jQuery，因为我认为它只适用于1.5。（目前，它只会在所有文本区域中添加值并更新一个span元素）

A.
B
C
D
E

这是其中一个textareas，所有这些都遵循类似的方式，我想用它们将select中的数据价格乘以textarea中输入的数字（所有textareas和select在name元素后面都有相同的[]），然后我想将所有这些产品添加到span#currentCost:

<td class="L1" width="175">
    Cost: <span class="redmoney" id="currentCost" name="currentCost">$0</span>
</td>

费用：0美元

如果这有意义的话…

试试看

$(document).ready(function () {
    calculateSum();
    //register change handler for input and select elements
    $(document).on("keyup, change", ".txt, select", function () {
        calculateSum();
    });
});

function calculateSum() {
    var sum = 0;
    $(".txt").each(function () {
        var value = $.trim(this.value);
        if (value.length && !isNaN(value)) {
            //find the select in the previous td and multiply the value
            sum += parseFloat(value) * ($(this).parent().prev().find('option:selected').data('price') || 0);
            //change back the color
            $(this).css("background-color", "");
        } else if (this.value.length != 0) {
            $(this).css("background-color", "red");
        }
    });
    $("#currentCost").html(sum.toFixed(2));
}

演示：

不推荐使用.live（）方法（在jQuery 1.7之后）。改为使用.on（）。

$(document).ready(function () {
    calculateSum();
    //register change handler for input and select elements
    $(document).on("keyup, change", ".txt, select", function () {
        calculateSum();
    });
});

function calculateSum() {
    var sum = 0;
    $(".txt").each(function () {
        var value = $.trim(this.value);
        if (value.length && !isNaN(value)) {
            //find the select in the previous td and multiply the value
            sum += parseFloat(value) * ($(this).parent().prev().find('option:selected').data('price') || 0);
            //change back the color
            $(this).css("background-color", "");
        } else if (this.value.length != 0) {
            $(this).css("background-color", "red");
        }
    });
    $("#currentCost").html(sum.toFixed(2));
}