在 jQuery 中使用 Each() 和 Children() 的表单计算器

Question

我正在尝试构建一个表单，该表单根据一系列带有字符串值的下拉框计算总价，例如“此选项花费 30 英镑”，我知道这并不理想，但我将其放在一起作为 hack现有脚本

在大多数情况下，我得到了它的工作，但我不确定如何为#productconfig 的每个子项运行每个函数

我可以手动将每个下拉列表的 id 输入到一个数组中，这样就可以进行计算，但如果它只与 #productconfig 的所有子项一起使用会很好

<code>

<div id="#productconfig">
<label>Model Type</label> 
<select name="products[220][data][modeltype]" id="data-modeltype-220">
    <option value="M-Type £500">M-Type £500</option>
    <option value="P-Type £500">P-Type £500</option>
    <option value="S-Type £500">S-Type £500</option>
</select>   
</div>
</code>

<code>
$(document).ready(function() {
$("#productconfig").children().change(function () {
    calculateoptions();
});
calculateoptions();
});
</code>
<code>
function calculateoptions() {

var arr = ["data-modeltype-220"];

var total = 0;

jQuery.each(arr, function () {
    var str = $('#' + this).attr("value");
    var poundsign = str.indexOf('£');
    var poundsign = poundsign + 1;
    var lengthofstr = str.length;
    var shortstr = str.substr(poundsign, lengthofstr);
    total = eval(total) + eval(shortstr);
});

$('#price').html("£" + total);

}
</code>

Answer 1

这个怎么样：

function calculateoptions() {

var total = 0;

jQuery('#productconfig select').each(function () {
        total += $(this).val().match(/£(\d+)/)[1];
});

$('#price').html("£" + total);

}

Answer 2

你可以使用：

 $("#productconfig select").each(function(){...});

选择产品配置 div 中的每个下拉菜单。