Javascript/jQuery解决方案从表格中下拉列表中总结数值

Question

我只是学习JavaScript和jQuery的绳索，但无法让我的头在这附近。我有3个下拉菜单，其中有几个产品，每个菜单都有不同的值。我想要做的就是让用户在每个下拉列表中选择一个项目，当他们点击提交按钮时，值将被添加，并且总数将显示在文本框中。我现在花了14个小时试图做到这一点没有成功，所以任何帮助将大部分感谢！

Answer 1

它很难确切地知道你在找什么，但是这个附加的JSFiddle完成你所描述的任务 - 让我知道你是否想要解释它的任何部分。

http://jsfiddle.net/FdZDP/1/

继承人的要点：

$("#button").click(function() { 
    var total = 0; 
    $.each($(".summable") ,function() { 
     total += parseInt($(this).val()); 
    }); 
    $("#sum").val(total) 
}); 

Answer 2

这应该是它的要点：

$(function(){ 
    $('#my_form').submit(function(e){ 
     e.preventDefault(); 
     var val1 = $("#dropdown1").val(); 
     var val2 = $("#dropdown2").val(); 
     var val3 = $("#dropdown3").val(); 
     var total = parseInt(val1) + parseInt(val2) + parseInt(val3); 
     $("#my_textbox").val(total); 
    }); 
}); 

你抓住从每个下拉列表中选择的值。然后，将它们加在一起，确保它们是整数（如果不需要整数，则以某种方式转换为数字）。然后，将该值放入文本框中。

Answer 3

对于考夫曼的答案的变体：

$("#button").click(function() { 
    var total = $('.summable').toArray().reduce(function(a, e) { 
     return a + parseInt($(e).val(), 10); 
    }, 0); 
    $("#sum").val(total) 
}); 

它使用ES5 Array.reduce()函数来处理值的总和