セレクトボックスで、逆順に選択しても同じにしたい
タイトルが意味不明ですが、要するに、
1つ目の選択肢に、中百舌鳥、深井、泉ケ丘、栂・美木多、光明池とあります。
2つ目の選択肢にも、同じように、中百舌鳥、深井、泉ケ丘、栂・美木多、光明池とあります。
これを、例えば、選択肢1で中百舌鳥、2で深井を選択したときと、逆の場合、
選択肢1で深井、2で中百舌鳥を選んだ場合とで、挙動が同じになるようにしたいです。
ちなみに結果は、190円と返ってきます。
どのようにしたらいいですか。
jsの部分は抜かさず記述してください。
以下はその文です。
<!DOCTYPE html>
<meta charset="utf-8">
<title></title>
<style>
</style>
<body>
<p id=A>
<select id=B>
<option value="">--
<option value="nakamozu">中百舌鳥
<option value="fukai">深井
<option value="izumigaoka">泉ケ丘
<option value="togamikita">栂・美木多
<option value="komyoike">光明池
<option value="a0">a0
<option value="a1">a1
<option value="a2">a2
</select>
<select id=C>
<option value="">--
<option value="nakamozu">中百舌鳥
<option value="fukai">深井
<option value="izumigaoka">泉ケ丘
<option value="togamikita">栂・美木多
<option value="komyoike">光明池
<option value="b0">b0
<option value="b1">b1
<option value="b2">b2
</select>
</p>
<p id=D></p>
<script>
const vals = {
'nakamozufukai':3.7,
'nakamozuizumigaoka':7.8,
'a0b0': 1.2,
'a0b1': 12,
'a0b2': 28.8,
},
len = [ 2, 4, 6, 8, 10],
prc = [170,190, 210, 230, 250],
f=(_,l=Math.round(_))=>D.textContent=l?prc[len.findIndex(_=>_>l)]+'円':'';
A.addEventListener('change',_=>f(vals[B.value+C.value]));
</script>
お礼
できました！ありがとうございます。 selectedIndexで設定できるのを忘れていました。