詳しい人求む！

セレクトボックスを2つ選択してメッセージなどを表示するには。～運賃検索プログラムを完成させたい～

締切済

質問者：福本英一
質問日時：2022/07/22 11:10
回答数：1件

セレクトボックスを2つ選択してメッセージなどを表示するには。～運賃検索プログラムを完成させたい～
次では、セレクトボックスで選択をすれば、メッセージが表示されるようになっています。
<script type="text/javascript" language="javascript">
function onButtonClick() {
selindex = document.form1.Select1.selectedIndex;
target = document.getElementById("output");
switch (selindex) {
case 0:
target.innerHTML = "要素1が選択されています。<br/>";
break;
case 1:
target.innerHTML = "要素2が選択されています。<br/>";
break;
case 2:
target.innerHTML = "要素3が選択されています。<br/>";
break;
case 3:
target.innerHTML = "要素4が選択されています。<br/>";
break;
case 4:
target.innerHTML = "要素5が選択されています。<br/>";
break;
}
}
</script>
これと、組み合わせたいのが次のjsの文章です。どうしたらいいですか。
<script type="text/javascript">

function kotae()
{
ten=0
if((f.q1.value == "松山市"&&f.q2.value == "高松市")||(f.q1.value == "高松市"&&f.q2.value == "松山市"))
{f.q1.style.backgroundColor="aqua ";ten = ten + 50}
else f.q1.style.backgroundColor="red"
if(f.q3.value == "名古屋市"){f.q3.style.backgroundColor="aqua ";ten = ten + 25}
else f.q3.style.backgroundColor="red"
if(f.q4.value == "金沢市") {f.q4.style.backgroundColor="aqua ";ten = ten + 25}
else f.q4.style.backgroundColor="red"
f.tokuten.value=ten
const keywords = ['あいうえお','かきくけこ', 'さしすせそ'];
if (f.tokuten.value=50) {
for (let i = 0; i < keywords.length; i++) {
console.log(f.rank.value=keywords[0]);
}}
else if(f.tokuten.value >=20){f.rank.value = 'B'}
else if(f.tokuten.value >=15){f.rank.value = 'C'}
else if(f.tokuten.value <10){f.rank.value = 'D'}
//ここまで
}
</script>
<body>
<form name="f">
愛媛県の県庁所在地は
<select name="q1">
<option>選択肢</option>
<option>名古屋市</option>
<option>松山市</option>
<option>金沢市</option>
<option>高松市</option>
</select>
です。
<p>
香川県の県庁所在地は
<select name="q2">
<option>選択肢</option>
<option>名古屋市</option>
<option>松山市</option>
<option>金沢市</option>
<option>高松市</option>
</select>
です。<p>
愛知県の県庁所在地は
<select name="q3">
<option>選択肢</option>
<option>名古屋市</option>
<option>松山市</option>
<option>金沢市</option>
<option>高松市</option>
</select>
です。<p>
石川県の県庁所在地は
<select name="q4">
<option>選択肢</option>
<option>名古屋市</option>
<option>松山市</option>
<option>金沢市</option>
<option>高松市</option>
</select>
です。<p>
<input type="button" name="b1" value="答え合わせ" onclick="kotae()"> <p>
<input name=tokuten size="6">点

<input name=rank class="hoge">ランク

これらを組み合わせて、設問１と設問2でそれぞれ松山市と高松市を選択すればメッセージが表示されるようにしたいです。