一個下拉菜單，2個收音機，2個輸入

好的，即使用我的母語也很難解釋，但我會盡量保持清晰。一個下拉菜單，2個收音機，2個輸入

我有一個下拉選擇不同的選項。選擇其中一個後，用戶需要檢查兩個單選按鈕中的哪一個，最終會在兩個不同的輸入字段中給出結果。例如 - 如果您從下拉菜單中選擇選項2，然後選中單選按鈕1，則輸入一個顯示某個值，輸入2顯示其他值。

<select id="single"> 
    <option>Select an item</option> 
    <option data1="140x200" data2="1">80x190</option> 
    <option data1="140x200/220" data2="2">80x200</option> 
    <option data1="140x220" data2="3">80x210</option> 
</select> 

<input type="radio" id="radioButton1" name="radioButton" value="enkel" /> 
<label for="radioButton1">enkel</label> 
<input type="radio" id="radioButton2" name="radioButton" value="dubbel" /> 
<label for="radioButton2">dubbel</label> 
<input type="text" id="dekbed"> 
<input type="text" id="overtrek">

我有這個jsfiddle我做的，所以也許它有助於澄清。

FIDDLE

也許我應該給4個屬性在下拉每個選項（DATA1，DATA2，DATA3，DATA4），使得對於選擇的選項它給DATA1輸入#dekbed和data2的輸入#overtrek如果radio1被選中，data3輸入#dekbed和data4輸入#overtrek，如果選中radio2。

我希望你們明白這一點，我真的很感謝這個幫助，因爲我還沒有看到過這種選擇方式。

來源

2013-04-05 astronaut

我不能告訴你當前的代碼是什麼問題。你不希望它做什麼？ – maxedison 2013-04-05 10:10:35

它應該給出不同的結果，具體取決於檢查哪個單選按鈕。就像現在一樣，它總是給我預先定義的兩個選項。比方說，我希望它顯示你已經看到的兩個結果，但只有在收音機1被選中的情況下，以及在選中收音機2的情況下兩個不同的結果。 – astronaut 2013-04-05 10:15:30

宇航員：你想要在yoyr下拉列表中的每個選項中添加兩個屬性？以便您可以根據單選按鈕將輸入文本中的相應文本設置爲第二個條件。確切地說， – dreamweiver 2013-04-05 10:17:39

你可以嘗試添加一個條件，以檢查是否每個單選按鈕日常

$("#single option:selected").each(function() {

例如，對於radioButton1的內部檢查這將是

if ($("#radioButton1").is(':checked')){ .... do something }

如果radioButton1被選中，改變數值1和數據2的值。

否則，如果radioButton2被選中

if ($("#radioButton2").is(':checked')){ .... do something different}

變化dekbed和overtrek到DATA3值和數據4

編輯注：您將需要添加這些方法既選擇框的變化事件，和單選按鈕輸入。

我創建了一個小提琴看出該方案在：jsfiddle.net/dbS2Q/1/

我希望這有助於！

來源

2013-04-05 10:31:11 KernelPanik

這裏是如何我寫了下面的說明，我明明沒有它正確，因爲它不工作（我是新手）寫： { $（「＃單選項：選擇」）。每個（函數（）{$ （「＃radiobutton1」）爲（ '：檢查'）{ （ '#dekbed'）VAL（$（本）.attr（ '數據1'））; （ '#overtrek'）VAL（$（。 this）.attr（'data2'））; }; }）; }; （（'：checked'）） {（'#dekbed'）。val（$（「這個）.attr（'data3'））; （'#overtrek'）.val（$（this）.attr（'data4'））; }; }）; }; – astronaut 2013-04-05 11:04:26

不知道是否允許我再次連結小提琴，但我會嘗試： http://jsfiddle.net/astronaut/P7bJ5/42/ – astronaut 2013-04-05 11:09:04

您好，我更新了例子，我創建了一個小提琴，我認爲完成的任務你正在努力。另外，更正了我拼寫radioButton1和radioButton2（區分大小寫）的方式。你可以查看更新的小提琴：[鏈接] http://jsfiddle.net/9UQd2/1/ – KernelPanik 2013-04-05 12:11:51

一個下拉菜單，2個收音機，2個輸入

回答

相關問題