Question

我在Twitter Bootstrap中有一个复选框列表，格式如下：

<form method='post' class="form-horizontal" id="myform">
   <input type="checkbox" attr1="2" attr2="4" prodname="product1"> product1
   <input type="checkbox" attr1="5" attr2="1" prodname="product2"> product2
   <input type="checkbox" attr1="1" attr2="7" prodname="product3"> product3
   ....
   ....
   <button type="submit" class="btn btn-success pull-right">Calculate</button>
</form>

用户将选择一些产品（不是全部产品）并单击提交按钮以查看以下公式的结果：

finalvalue = sum_of_attr1/total_num_checked + 10*best_prod_attr1 - best_prod_attr2

这意味着我必须找到已选中框的所有attr1的总和以及检查的数量，然后尝试每个复选框以查看哪些将给出最大值。然后我将更新一个div，其中包含最终值和最佳产品的prodname。

我不想在服务器端执行此操作，我想尝试使用Javascript / JQuery。有什么想法吗？

Answer 1

对于＆＃34; best＆＃34;计算：请参阅此SO问题：jQuery: How to calculate the maximal attribute value of all matched elements?

对于已选中复选框的数量：How to count check-boxes using jQuery?

评论后编辑并更好地表达预期的行为：

var sumAttr1 = null;
var bestProductName = null;
var maxScorePart = null;

// Browse each checked input to get the sum of attr1 and get the best product
$('input:checkbox:checked').each(function() {
    var valueAttr1 = parseInt($(this).attr('attr1'));
    var valueAttr2 = parseInt($(this).attr('attr2'));

    // Cumulate attr1 for final calc
    sumAttr1 += valueAttr1;

    // Check best prod
    var currentScorePart = 10 * valueAttr1 - valueAttr2;
    if(currentScorePart > maxScorePart) {
        maxScorePart = currentScorePart;
        bestProductName = $(this).attr('prodname');
    }
});

var maxScore = sumAttr1 / $('input:checkbox:checked').length + maxScorePart;
alert('Best product = ' + bestProductName + '\r\nBest product score = ' + maxScore);

参见工作示例：http://jsfiddle.net/5whctawh/

使用Javascript在复选框中进行计算

1 个答案: