創建創建依賴於HTML表單檢查

親愛的朋友計算器單選框動態總一個javascript，創建創建依賴於HTML表單檢查

我創建一個在線的HTML表單，並創建了一個JavaScript函數來動態地（不完全確定我使用這個詞是正確的）在選擇選項時在表格底部顯示應付會費總額。總費用取決於會員類型，國家和付款方式。當我計算的所有信息都是按照國家的會員類型和郵費時（我使用這兩種選項的下拉式表單），它完美運行。現在我想在方程中添加第三項（付款方式 - 一種可選擇支票或PayPal），但我無法實現。我這次使用單選按鈕。

我的共計功能是這樣的（不帶「+ getPaypalfee（）」，它工作得很好）：

function getAmountDue() 
    { 
    var amountDue = getMembershipPrice() + getExtraPostagePrice() + getPaypalfee(); 
    document.getElementById('amountDue').innerHTML ="Amount Due: $"+amountDue; 
    }

我寫回到貝寶收費的JavaScript是這樣的（它已經成爲非常令人費解，我不知道在那裏我已經錯了，如何重新啓動）：

var paymentmethod_Fee = new Array(); 
paymentmethod_Fee["cheque"]=0; 
paymentmethod_Fee["paypal"]=2; 

function getPaypalfee() 
    { 
    var paypalFee=0; 
    for (var i=0; i < document.membershipform.payment_method.length; i++) 
     { 
     if (document.membershipform.payment_method[i].checked) 
      { 
      var selectedPaymentmethod = document.membershipform.payment_method[i].value; 
      } 
     } 
    paypalFee = paymentmethod_Fee[selectedPaymentmethod.value]; 
    return paypalFee; 
    }

單選按鈕的HTML看起來像這樣：

<p>I will make payment via: <BR>         
<input type="radio" id="payment_method" name="payment_method" value="cheque" checked="yes" onchange="getAmountDue()">Cheque 
<input type="radio" id="payment_method" name="payment_method" value="paypal" onchange="getAmountDue()">Paypal (Add $2)

對我的邏輯中的缺陷的任何見解都非常感謝！我是一個JavaScript新手，單選按鈕似乎是我的剋星（我想學習如何使用它們，而不是用下拉菜單或我知道如何去做的事情來替換它們）。

謝謝！

來源

2013-02-09 Deeee

你能展示一個[最小的，代表性的]（http://sscce.org/），[現場演示]（http://jsfiddle.net/），我們可以用它來看你的問題嗎？ – 2013-02-09 22:34:30

我希望這是成功的：http://jsfiddle.net/Deeee/ccFL6/3/ – Deeee 2013-02-10 19:15:10

http://jsfiddle.net/Deeee/ccFL6/ – Deeee 2013-02-10 19:39:53

不應該使用數組來創建項目之間的映射。什麼你要找的是一個對象：

var fees = { 
    cheque: 0, 
    paypal: 2 
};

至於你的錯誤，這是該行就在這裏：

paypalFee = paymentmethod_Fee[selectedPaymentmethod.value];

paymentmethod_Fee已經是一個字符串。它沒有value屬性。

來源

2013-02-09 22:40:23 Blender

這很有趣，因爲我使用數組來創建成員價格的映射和它的工作... – Deeee 2013-02-10 18:35:40

不要使用多個元素與id相同。這樣做會造成毛刺。OVER 9000毛刺。所以，不要使用重複的id s。不要。這是網站開發的一個準則。它會爲你服務。按照它的信。或者，您將有毛刺。我相信你不想毛刺。擺脫故障。請勿使用重複的id s。

（前段TL;博士：總是有獨特的id S，或者你得到毛刺）

你應該ID payment_methods包裹在div你radio按鈕。然後，使用document.getElementById("payment_methods").childNodes[i]來訪問每個連續的按鈕。

（順便說一下，用相同的name 2個radio按鈕是互斥的，所以按鈕應具有相同的name秒，但不同id秒）

您正確使用checked。這只是你如何訪問導致毛刺的元素。

希望這可以擺脫你的故障。

來源

2013-02-09 23:44:31 MathSquared

啊！這很有意義。我已經按照建議將它包裹在一個div中了....我仍然明顯錯過了一些東西......我保持單選按鈕的ID相同，但是一次只能檢查一個。 http://jsfiddle.net/Deeee/ccFL6/11/ – Deeee 2013-02-10 19:38:29

http://jsfiddle.net/Deeee/ccFL6/ – Deeee 2013-02-10 19:39:28

這是通過'name'完成的。 'id'總是唯一的，因爲它指的是一個特定的元素。 'name'指的是表單字段，因此在同一組的'radio'按鈕之間重複。 – MathSquared 2013-02-10 23:07:34

創建創建依賴於HTML表單檢查

回答

相關問題