3個選擇框，但基於所有3的選擇的一個值

-1

我正在製作眼鏡的保險表單，第一個選擇框是保險計劃。第二個選擇框是鏡頭的樣式，第三個框是鏡頭上想要的選項。是否有辦法從3份保險計劃中選擇，然後選擇鏡片樣式，然後選擇一個選項並將其金額放入保險之前的輸入框和保險之後的另一個輸入框中。該值將基於最後選擇的選項，但基於Plan和鏡頭樣式的不同金額？3個選擇框，但基於所有3的選擇的一個值

想的是這樣的：

<select> 
<option>Plan A</option> 
<option>Plan B</option> 
<option>Plan C</option> 
</select> 

<select> 
<option>Single Vision</option> 
<option>Bifocal</option> 
<option>Trifocal</option> 
<option>Progressive</option> 
</select> 

<select id="options1"> 
<option>Anti-Glare Coating</option> 
<option>Transitions</option> 
<option>Edge Polish</option> 
<option>Sunglass Tint</option> 
</select> 
<input type="text" id="before1" class="before"> 
<input type="text" id="after1" class="after">

好吧，如果你選擇「A計劃」，在下拉，然後選擇在另一個下拉單視功能，選項將花費：

<select id="options1"> 
<option value="140,85">Anti-Glare Coating</option> 
<option value="100,76">Transitions</option> 
<option value="16,9">Edge Polish</option> 
<option value="36,15">Sunglass Tint</option> 
</select>

但是，如果您選擇計劃B，進展，相同選項的成本會改變，因爲前兩個選擇。希望這有助於澄清。我想我正在尋找改變基於前兩個選擇框的鏡頭選項的價值。 :-)

來源

2016-11-10 Mike LaFrance

你能澄清要求嗎？這有點混亂。你在談論連接的下拉菜單嗎？ –

是的，這是可能的。請開始，我們會在您遇到困難時提供幫助。首先給出選項的一個值屬性 – mplungjan

您可以創建一個對象，顯示每個選項的價格：用戶從菜單中選擇

再經過

var prices = { 
    'Plan A': { 
     'Single Vision': { 
      'Anti-Glare Coating': { 
       before: 100, 
       after: 50 
      }, 
      'Transitions': { 
       before: 80, 
       after: 60 
      }, 
      ... 
     }, 
     ... 
    }, 
    ... 
}

，得到的值，並以此作爲索引到對象：

var plan = document.getElementById("plan").value; 
var type = document.getElementById("type").value; 
var option = document.getElementById("options1").value; 
document.getElementById("before1").value = prices[plan][type][option].before; 
document.getElementById("after1").value = prices[plan][type][option].after;

在一個真正的應用程序中，你不會像這樣硬編碼對象，你可以使用AJAX從數據庫中獲取它。

來源

2016-11-10 17:59:02 Barmar

3個選擇框，但基於所有3的選擇的一個值

回答

相關問題