2017-12-16 5 views
-1

以下に示すように、3つのドロップダウン選択値があります。たとえば、car = volvoとcolor = Black、name = Jone //とすると、javaScriptで何かをしたりアラート(クール)したりすることができます。ありがとうございました。if文を使用するにはjavascriptとhtmlを使用して選択した3つの値をドロップダウンする場合

<select> 
<option value="volvo">Volvo</option> 
<option value="saab">Saab</option> 
<option value="opel">Opel</option> 
<option value="audi">Audi</option> 
</select> 

<select> 
<option value="red">red</option> 
<option value="blue">blue</option> 
<option value="black">black</option> 
<option value="green">green</option> 
</select> 

<select> 
<option value="'mark">'mark</option> 
<option value="jones">jones</option> 
<option value="james">james</option> 
<option value="Vardy">Vardy</option> 
</select> 
+0

[変更の選択から選択した値/テキストを取得](https://stackoverflow.com/questions/5416767/get-selected-の可能な重複を –

+0

[JavaScriptを使用してドロップダウンリストで選択した値を取得しますか?](https://stackoverflow.com/questions/1085801/get-selected-value-in-dropdown-リスト使用 - javascript) –

答えて

0

2つの方法でバインドし、同じ値変更リスナーを3つのすべてのドロップダウンに適用すると、非常に簡単でした。

ただし、ここではまた、3つの異なるIDをドロップダウンに提供し、onchange属性を使用して同じ値変更リスナーでバインドすることもできます。

値変更リスナー関数では、document.getElementByIdによってすべての3つのドロップダウン値の値を取得し、それらをコンパイルし、それに応じてアラートを表示します。あなたは、私が作成し、それのための試料溶液の下に見つけることができます。

<head> 
<script> 
function dropdownChange() { 
var car=document.getElementById("car").value; 
var color=document.getElementById("color").value; 
var owner=document.getElementById("owner").value; 
if(car==="volvo" && color==="red" && owner ==="james") { 
    alert("Cool"); 
} 
} 
</script> 
</head> 
<body> 
<select id ="car" onchange="dropdownChange();"> 
<option value="volvo">Volvo</option> 
<option value="saab">Saab</option> 
<option value="opel">Opel</option> 
<option value="audi">Audi</option> 
</select> 

<select id="color" onchange="dropdownChange();"> 
<option value="red">red</option> 
<option value="blue">blue</option> 
<option value="black">black</option> 
<option value="green">green</option> 
</select> 

<select id="owner" onchange="dropdownChange();"> 
<option value="'mark">'mark</option> 
<option value="jones">jones</option> 
<option value="james">james</option> 
<option value="Vardy">Vardy</option> 
</select> 
</body> 
関連する問題