使用javascript計算在線訂單總計

Question

我正在處理一個基本的訂單表格，我想看看我是否可以從stratch構建它。

我有一個表格，其中包含一個列出了12個項目的表格，以及項目數量的文本輸入字段。 我想要做的是讓代碼在表單中運行以檢查已輸入的任何數量，然后將這些值與數組中的價格相關聯。

到目前為止我有陣列：

var juicePrice = new Array();
juicePrice["citrusZing"]=20.00;
juicePrice["strawberrySmooth"]=22.00;
juicePrice["carrotSpin"]=21.50;
juicePrice["Tropical"]=20.75;
...

以及貫穿表單的方法：

calculateTotal()    
{   
var juiceForm = document.forms["juiceform"];

    //Get a reference to the juice the user Chooses name=selectedJuiceQty":
    var selectedJuiceQty = juiceForm.elements["selectedJuiceQty"];

    for(var i = 0; i < selectedJuiceQty.length; i++);

但我不太清楚如何連接表單中的信息來計算總數。 誰能指出我正確的方向？ 這是這樣的嗎？

for(var i = 0; i < selectedJuiceQty.length; i++){
    var juiceTotal = 0;

    if(selectedJuiceQty[i]>0) {
        juiceTotal += juicePrice[selectedJuiceQty[i].value]*selectedJuiceQty;
        //If we get a match then we break out of this loop
        break;
    }
    return total;
}

是否可以為每個字段使用相同的名稱標簽，或者我應該使用citrusZingQty = parseInt(document.getElementById("citrusZing").value); 對於每個項目？ 然后我必須列出所有項目，這似乎不是一個非常優雅的方式。 如果選擇多個項目會發生什么？

任何人都可以幫助指出我正確的方向將是偉大的。

Answer 1

所以你可以做你想做的事。 邁克爾在評論中指出了這一點，但它可能被忽略了。

var myPrices = new Object();
myPrices['eggs'] = 1.50;
myPrices['bread'] = 1.00;
// ...

然后，您可以遍歷表單字段並檢查“myPrices”對象。

編輯

要在評論中回答您的問題 - 我不會對所有輸入字段使用相同的名稱。 它確實可以使表單更容易循環。 但是，在我看來，使用輸入標記的id / class並不是一個很好的解決方案。 HTML id / class用於CSS / Javascript操作，並使用它來識別輸入代表哪些水果對於項目的其他開發人員來說不明顯（我意識到這可能是一個小項目，但最好不要啟動任何陋習）。 我會在它代表的果汁/飲料之后命名每個輸入。