２つの計算結果を一つのボタンで同時挙動させたいです。

#2

えっぴ～さんが書きました: ↑
1年前
コード:
var button = document.getElementById("button");
var button = document.getElementById("button");

同じことが2回書かれています。1個消したほうがいいでしょう。

えっぴ～さんが書きました: ↑
1年前
コード:
button_2.addEventListener("click_2", function(e_2) {

button_2 は定義されていません。

えっぴ～さんが書きました: ↑
1年前
普通大人運賃と普通小児運賃の計算をボタン一つで計算する場合、どうしたらいいですか。

普通大人運賃と普通小児運賃の計算をボタン一つで計算するプログラムを書いて実行したらいいと思います。
たとえば、

コード:

button.addEventListener("click", function() {
    // 普通大人運賃の計算をするプログラム
    // ...

    // 普通小児運賃の計算をするプログラム
    // ...
});

みたいな。

えっぴ～さんが書きました: ↑
1年前
イベントは一つのhtmlで同時使用できないため

仕様上、そんな制約は無いと思います。
スキル不足や縛りプレイなどによる制約は知りませんが。

#1

２つの計算結果を一つのボタンで同時挙動させたいです。
他でも出しましたが、明確な回答は得られなかったです。
https://teratail.com/questions/oeums8eqycky7s
以下はそのhtmlコードです。

コード:

<style>
textarea.hoge { width: 150px; height:200px;}
</style>
<body>
<form name="semboku_f">
出発駅
<select name="semboku_q1">
<option>選択肢</option>
<option>中百舌鳥</option>
<option>深井</option>
<option>泉ケ丘</option>
</select>
到着駅 
<select name="semboku_q2">
<option>選択肢</option>
<option>中百舌鳥</option>
<option>深井</option>
<option>泉ケ丘</option>
</select>
<input type="button" name="b1" value="運賃検索" onclick="semboku_kotae()"> <p></input>
<table border="1">
<tr><th>距離</th><th>
<input name=semboku_tokuten size="6">km</input></th></tr>
<tr><th>普通大人</th><th><input name=semboku_futsu_otona id="semboku_futsu_otona_2">円</input></th></tr>
<tr><th>普通小児</th><th><input name=semboku_futsu_shoni id="semboku_futsu_kodomo_2">円</input></th></tr>
</table>
</form>
<body>
<form name="osakametro_f">
出発駅
<select name="osakametro_q1">
<option>選択肢</option>
<option>江坂</option>
<option>梅田</option>
<option>なんば</option>
</select>
到着駅
<select name="osakametro_q2">
<option>選択肢</option>
<option>江坂</option>
<option>梅田</option>
<option>なんば</option>
</select>
<input type="button" name="b2" value="運賃検索" onclick="osakametro_kotae()"> <p></input>
<table border="1">
<tr><th>距離</th><th>
<input name=osakametro_tokuten size="6">km</input></th></tr>
<tr><th>普通大人</th><th><input name=osakametro_futsu_otona id="osakametro_futsu_otona_2">円</input></th></tr>
<tr><th>普通小児</th><th><input name=osakametro_futsu_shoni id="osakametro_futsu_kodomo_2">円</input></th></tr>
</table>
<body>
    <form>
 
        <button id="button">足す</button>
    </form>

<table border="1">
<tr><th><label for="futsus_otona">普通大人: </label></th><th><input type="text" id="futsu_otona"></th></tr>
<tr><th><label for="futsus_shoni">普通子供: </label></th><th><input type="text" id="futsu_shoni"></th></tr>
<table>
</body>
 
<script>
function semboku_kotae()
{
semboku_ten=0
if((semboku_f.semboku_q1.value == "中百舌鳥"&&semboku_f.semboku_q2.value == "深井")||(semboku_f.semboku_q1.value == "深井"&&semboku_f.semboku_q2.value == "中百舌鳥"))
{semboku_f.semboku_q1.style.backgroundColor="aqua ";semboku_ten = semboku_ten + 3.7}
else if((semboku_f.semboku_q1.value == "中百舌鳥"&&semboku_f.semboku_q2.value == "泉ケ丘")||(semboku_f.semboku_q1.value == "泉ケ丘"&&semboku_f.semboku_q2.value == "中百舌鳥"))
{semboku_f.semboku_q1.style.backgroundColor="aqua ";semboku_ten = semboku_ten + 7.8}
else semboku_f.semboku_q1.style.backgroundColor="red"
semboku_f.semboku_tokuten.value=semboku_ten

//ここから
//大人
if(semboku_f.semboku_tokuten.value<2){semboku_f.semboku_futsu_otona.value = Number("180")}
else if(semboku_f.semboku_tokuten.value<4)
{semboku_f.semboku_futsu_otona.value = Number("200")}
//ここまで
//子供
if(semboku_f.semboku_tokuten.value<2){semboku_f.semboku_futsu_shoni.value = Number("90")}
else if(semboku_f.semboku_tokuten.value<4)
{semboku_f.semboku_futsu_shoni.value = Number("100")}

}
</script>
<script>
function osakametro_kotae()
{
osakametro_ten=0
if((osakametro_f.osakametro_q1.value == "江坂"&&osakametro_f.osakametro_q2.value == "梅田")||(osakametro_f.osakametro_q1.value == "なんば"&&osakametro_f.osakametro_q2.value == "梅田"))
{osakametro_f.osakametro_q1.style.backgroundColor="aqua ";osakametro_ten = osakametro_ten + 6.4}
else if((osakametro_f.osakametro_q1.value == "江坂"&&osakametro_f.osakametro_q2.value == "梅田")||(osakametro_f.osakametro_q1.value == "なんば"&&osakametro_f.osakametro_q2.value == "梅田"))
{osakametro_f.osakametro_q1.style.backgroundColor="aqua ";osakametro_ten = osakametro_ten + 10.5}
else osakametro_f.osakametro_q1.style.backgroundColor="red"
osakametro_f.osakametro_tokuten.value=osakametro_ten
//ここから

if(osakametro_f.osakametro_tokuten.value<3){osakametro_f.osakametro_futsu_otona.value = Number("180")}
else if((osakametro_f.osakametro_tokuten.value<7)&&(!((osakametro_f.osakametro_q1.value == "光明池"&&osakametro_f.osakametro_q2.value == "和泉中央")||(osakametro_f.osakametro_q1.value == "和泉中央"&&osakametro_f.osakametro_q2.value == "光明池"))))
{osakametro_f.osakametro_futsu_otona.value = Number("230")}
//ここまで
//子供
if(osakametro_f.osakametro_tokuten.value<3){osakametro_f.osakametro_futsu_shoni.value = Number("90")}
else if((osakametro_f.osakametro_tokuten.value<7)&&(!((osakametro_f.osakametro_q1.value == "光明池"&&osakametro_f.osakametro_q2.value == "和泉中央")||(osakametro_f.osakametro_q1.value == "和泉中央"&&osakametro_f.osakametro_q2.value == "光明池"))))
{osakametro_f.osakametro_futsu_shoni.value = Number("120")}
}
</script>
<script>

// ボタンの要素を取得
var button = document.getElementById("button");
var button = document.getElementById("button");
 
// ボタンをクリックした時の処理
button.addEventListener("click", function(e) {
 
    e.preventDefault();
 
    // 2つの入力フォームの値を取得
    var semboku_futsu_otona_2 = document.getElementById("semboku_futsu_otona_2").value;
    var osakametro_futsu_otona_2 = document.getElementById("osakametro_futsu_otona_2").value;
 
    // 2つの数値を足す
    var sum = parseInt(semboku_futsu_otona_2, 10) + parseInt(osakametro_futsu_otona_2, 10);
 
    // 足し算の結果を別の入力フォームに表示
    var futsu_otona = document.getElementById("futsu_otona");
    futsu_otona.value = sum;
});

button_2.addEventListener("click_2", function(e_2) {
 
    e_2.preventDefault();
 
    // 2つの入力フォームの値を取得
    var semboku_futsu_shoni_2 = document.getElementById("semboku_futsu_shoni_2").value;
    var osakametro_futsu_shoni_2 = document.getElementById("osakametro_futsu_shoni_2").value;
 
    // 2つの数値を足す
    var sum_2 = parseInt(semboku_futsu_shoni_2, 10) + parseInt(osakametro_futsu_shoni_2, 10);
 
    // 足し算の結果を別の入力フォームに表示
    var futsu_shoni = document.getElementById("futsu_shoni");
    futsu_shoni.value = sum_2;
});
</script>

尚、大阪メトロの部分は、id名を入れ替えたらできる話なので、今回は割愛しました。
を、例えば、普通大人運賃と普通小児運賃の計算をボタン一つで計算する場合、どうしたらいいですか。
一つなら挙動がうまくいきましたが、二つ目がいかんせんうまく挙動しません。
というより二つ目は空白のままです。
尚、自分がわかっているのはイベントは一つのhtmlで同時使用できないため、for関数を使用するのと、buttonタブであれば、[/code]for (let i = 0; i < buttonElements.length; i++) {
buttonElements.addEventListener('click', function () {}[/code]を使うことです。
自分が理解したいのは、例えば、
例えば、フォームで1+2と3＊5があったとします。
これを一つのボタンで、同時に挙動させたい時がありますよね。
これは、つまりそういう条件下のプログラムです。

		11月 2024
日	月	火	水	木	金	土
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30