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()函數來處理值的總和