teratail
回答率
85.29%
質問するログイン新規登録
トップHTML5に関する質問javascrpt文でバッティングしているタグがあれば、どこかご指摘をいただきたいです。

Q&A

0回答

1088閲覧

javascrpt文でバッティングしているタグがあれば、どこかご指摘をいただきたいです。

sembokulove
sembokulove

総合スコア91

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2023/12/20 00:00

0

1

実現したいこと

タグの重複をなくし、自動的に結果が出るように構築したいです。
タグをわかりやすくするため、路線別にnankai、sembokuとタグを割り振っていた際には計算が成功しました。
fareに変えたとたん、できなくなりました。なぜでしょうか？

前提

運賃計算プログラムを作っています。
違う路線を乗せると、なぜか挙動しないです。
恐らくタグの一部がバッティングしているものだと考えます。
cssにしろjavascriptにしろ、バッティングするタグは、
最初のものが無効化され、最後のほうが優先されてしまいます。
この状況を打破するには？
html文↓

<script src="南海 20220803 Wed\jsファイル 20220801 Mon\運賃 20220801 Mon.js"></script>
<script src="泉北 20220801 Mon\jsファイル 20220801 Mon\運賃 20220801 Mon.js"></script>
<script src="泉北 20220801 Mon\jsファイル 20220801 Mon\距離 20231219 Wed.js"></script>
<style>
textarea.hoge { width: 150px; height:200px;}
</style>
<!--HTMLここまで-->
<!--問題-->
<br>
<hr>
<br>
<!--阪和線-->
<body>
<form name="fare_f">
出発駅は 
<select name="fare_q1">
<option>選択肢</option>
<option id="hoge">難波</option>
<option>新今宮</option>
<option>天下茶屋</option>
<option>堺東</option>
<option>中百舌鳥</option>
<option>深井</option>
<option>泉ケ丘</option>
</select>
です。
<p>
到着駅は 
<select name="fare_q2">
<option>選択肢</option>
<option id="hoge">難波</option>
<option>新今宮</option>
<option>天下茶屋</option>
<option>堺東</option>
<option>中百舌鳥</option>
<option>深井</option>
<option>泉ケ丘</option>
</select>
です。<p>
<input id="result11" type="text11" value="" size="30">
<br>
<input id="result21" type="text21" value="" size="30">
<input type="reset" value="リセット"></p>
<input type="button" name="b1" value="運賃検索" onclick="fare_kotae()"> <p></input>
<table border="1">
<input name=fare_tokuten id="fare_tokuten_2" size="6" type="hidden"></input></th></tr>
<tr><th>普通大人</th><th><input name=fare_futsu_otona id="fare_futsu_otona_2">円</input></th></tr>
<tr><th>普通小児</th><th><input name=fare_futsu_shoni id="fare_futsu_shoni_2">円</input></th></tr>
<tr><th>通勤定期大人1か月</th><th><input name=fare_tsukin_teiki_otona_1 id="fare_tsukin_teiki_otona_1_2">円</input></th></tr>
<tr><th>通勤定期小児1か月</th><th><input name=fare_tsukin_teiki_shoni_1 id="fare_tsukin_teiki_shoni_1_2">円</input></th></tr>
<tr><th>通勤定期大人3か月</th><th><input name=fare_tsukin_teiki_otona_3 id="fare_tsukin_teiki_otona_3_2">円</input></th></tr>
<tr><th>通勤定期小児3か月</th><th><input name=fare_tsukin_teiki_shoni_3 id="fare_tsukin_teiki_shoni_3_2">円</input></th></tr>
<tr><th>通勤定期大人6か月</th><th><input name=fare_tsukin_teiki_otona_6 id="fare_tsukin_teiki_otona_6_2">円</input></th></tr>
<tr><th>通勤定期小児6か月</th><th><input name=fare_tsukin_teiki_shoni_6 id="fare_tsukin_teiki_shoni_6_2">円</input></th></tr>
<tr><th>通学定期大人1か月</th><th><input name=fare_tsugaku_teiki_otona_1 id="fare_tsugaku_teiki_otona_1_2">円</input></th></tr>
<tr><th>通学定期小児1か月</th><th><input name=fare_tsugaku_teiki_shoni_1 id="fare_tsugaku_teiki_shoni_1_2">円</input></th></tr>
<tr><th>通学定期大人3か月</th><th><input name=fare_tsugaku_teiki_otona_3 id="fare_tsugaku_teiki_otona_3_2">円</input></th></tr>
<tr><th>通学定期小児3か月</th><th><input name=fare_tsugaku_teiki_shoni_3 id="fare_tsugaku_teiki_shoni_3_2">円</input></th></tr>
<tr><th>通学定期大人6か月</th><th><input name=fare_tsugaku_teiki_otona_6 id="fare_tsugaku_teiki_otona_6_2">円</input></th></tr>
<tr><th>通学定期小児6か月</th><th><input name=fare_tsugaku_teiki_shoni_6 id="fare_tsugaku_teiki_shoni_6_2">円</input></th></tr>
</table>
<body>

</body>
<!--HTMLここまで-->
<!--問題-->
<hr />
<hr />
<hr />

<!DOCTYPE html>
<html lang="ja">
 
<head>
    <meta charset="UTF-8">
    <title>フォームに入力された数値の取得</title>
</head>

js文↓

function fare_kotae()
{
fare_ten=0
if((fare_f.fare_q1.value == "難波"&&fare_f.fare_q2.value == "新今宮")||(fare_f.fare_q1.value == "新今宮"&&fare_f.fare_q2.value == "難波"))
{fare_f.fare_q1.style.backgroundColor="aqua ";fare_ten = fare_ten + 201110002}
else if((fare_f.fare_q1.value == "難波"&&fare_f.fare_q2.value == "天下茶屋")||(fare_f.fare_q1.value == "天下茶屋"&&fare_f.fare_q2.value == "難波"))
{fare_f.fare_q1.style.backgroundColor="aqua ";fare_ten = fare_ten + 201110003}
else if((fare_f.fare_q1.value == "難波"&&fare_f.fare_q2.value == "堺東")||(fare_f.fare_q1.value == "堺東"&&fare_f.fare_q2.value == "難波"))
{fare_f.fare_q1.style.backgroundColor="aqua ";fare_ten = fare_ten + 201110008}
else if((fare_f.fare_q1.value == "新今宮"&&fare_f.fare_q2.value == "天下茶屋")||(fare_f.fare_q1.value == "天下茶屋"&&fare_f.fare_q2.value == "新今宮"))
{fare_f.fare_q1.style.backgroundColor="aqua ";fare_ten = fare_ten + 201110002}
else if((fare_f.fare_q1.value == "新今宮"&&fare_f.fare_q2.value == "堺東")||(fare_f.fare_q1.value == "堺東"&&fare_f.fare_q2.value == "新今宮"))
{fare_f.fare_q1.style.backgroundColor="aqua ";fare_ten = fare_ten + 201110009}
else if((fare_f.fare_q1.value == "天下茶屋"&&fare_f.fare_q2.value == "堺東")||(fare_f.fare_q1.value == "堺東"&&fare_f.fare_q2.value == "天下茶屋"))
{fare_f.fare_q1.style.backgroundColor="aqua ";fare_ten = fare_ten + 201110008}
else fare_f.fare_q1.style.backgroundColor="red"
fare_f.fare_tokuten.value=fare_ten

var myFunc = function(fare_kotoae_2) {
	const str = document.getElementById("color3").value;

	document.getElementById("span3").textContent = str;
}
//ここから

  if (fare_f.fare_tokuten.value==201110002) 
  {
    fare_f.fare_futsu_otona.value = Number("180");
    fare_f.fare_futsu_shoni.value = Number("90");
    fare_f.fare_tsukin_teiki_otona_1.value = Number("5980");
    fare_f.fare_tsukin_teiki_shoni_1.value = Number("3480");
  }
  else if (fare_f.fare_tokuten.value==201110003)
  {
    fare_f.fare_futsu_otona.value = Number("180");
    fare_f.fare_futsu_shoni.value = Number("90");
    fare_f.fare_tsukin_teiki_otona_1.value = Number("6860");
    fare_f.fare_tsukin_teiki_shoni_1.value = Number("3890");
    fare_f.fare_tsukin_teiki_otona_3.value = Number("19560");
    fare_f.fare_tsukin_teiki_shoni_3.value = Number("11080");
    fare_f.fare_tsukin_teiki_otona_6.value = Number("37050");
    fare_f.fare_tsukin_teiki_shoni_6.value = Number("20980");
    fare_f.fare_tsugaku_teiki_otona_1.value = Number("2450");
    fare_f.fare_tsugaku_teiki_shoni_1.value = Number("1700");
  }
  else if (fare_f.fare_tokuten.value==201110008)
  {
    fare_f.fare_futsu_otona.value = Number("290");
    fare_f.fare_futsu_shoni.value = Number("150");
    fare_f.fare_tsukin_teiki_otona_1.value = Number("10710");
    fare_f.fare_tsukin_teiki_shoni_1.value = Number("3890");
  }
  else if (fare_f.fare_tokuten.value==201110009)
  {
    fare_f.fare_futsu_otona.value = Number("290");
    fare_f.fare_futsu_shoni.value = Number("150");
    fare_f.fare_tsukin_teiki_otona_1.value = Number("11370");
    fare_f.fare_tsukin_teiki_shoni_1.value = Number("3890");


  }
  else if (fare_f.fare_tokuten.value==2011100012)
  {
    fare_f.fare_futsu_otona.value = Number("290");
    fare_f.fare_futsu_shoni.value = Number("150");
    fare_f.fare_tsukin_teiki_otona_1.value = Number("12690");
    fare_f.fare_tsukin_teiki_shoni_1.value = Number("4300");
  }
}

js文↓

function fare_kotae()
{
  fare_ten = 0;
  if ((fare_f.fare_q1.value=="栂・美木多" && fare_f.fare_q2.value=="光明池")
   || (fare_f.fare_q1.value=="光明池" && fare_f.fare_q2.value=="栂・美木多")) {
    fare_f.fare_q1.style.backgroundColor = "aqua";
    fare_ten = fare_ten + 201120001;
  }
  else if (((fare_f.fare_q1.value=="泉ケ丘" && fare_f.fare_q2.value=="栂・美木多")
        || (fare_f.fare_q1.value=="栂・美木多" && fare_f.fare_q2.value=="泉ケ丘"))
        || ((fare_f.fare_q1.value=="中百舌鳥" && fare_f.fare_q2.value=="深井")
        || (fare_f.fare_q1.value=="深井" && fare_f.fare_q2.value=="中百舌鳥"))
        || ((fare_f.fare_q1.value=="光明池" && fare_f.fare_q2.value=="和泉中央")
        || (fare_f.fare_q1.value=="和泉中央" && fare_f.fare_q2.value=="光明池"))) {
    fare_f.fare_q1.style.backgroundColor = "aqua";
    fare_ten = fare_ten + 201120002;
  }
else fare_f.fare_q1.style.backgroundColor="red"
fare_f.fare_tokuten.value=fare_ten

var myFunc = function(fare_kotoae_2) {
	const str = document.getElementById("color3").value;

	document.getElementById("span3").textContent = str;
}
//ここから

  if (fare_f.fare_tokuten.value==201120001) 
  {
    fare_f.fare_futsu_otona.value = Number("180");
    fare_f.fare_futsu_shoni.value = Number("90");
    fare_f.fare_tsukin_teiki_otona_1.value = Number("6950");
    fare_f.fare_tsukin_teiki_shoni_1.value = Number("3480");
  }
  else if ((fare_f.fare_tokuten.value==201120002)&&(!((fare_f.fare_q1.value=="光明池" && fare_f.fare_q2.value=="和泉中央")
        || (fare_f.fare_q1.value=="和泉中央" && fare_f.fare_q2.value=="光明池"))))
  {
    fare_f.fare_futsu_otona.value = Number("200");
    fare_f.fare_futsu_shoni.value = Number("100");
    fare_f.fare_tsukin_teiki_otona_1.value = Number("7770");
    fare_f.fare_tsukin_teiki_shoni_1.value = Number("3890");
  }

発生している問題・エラーメッセージ

そもそも、南海電車の運賃結果が出ない。

該当のソースコード

ソースコード

fare以外の部分に数値をつけていじったところ、
無変化なところと、泉北線文の挙動がおかしくなるところが出ました。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

int32_t
int32_t

2023/12/20 00:12 編集

私の理解力不足で、質問の意味が理解できません。 「タグ」をどういう意味で使ってますか? HTML/JS/CSS の分野であれば、「タグ」は「HTML中の < と > で囲まれた部分」を指します。 ・再現手順、期待する結果、実際の結果を具体的に書いてください。 ・関連するコードすべてを開示してください。JavaScript のファイルは3つあるはずですよね。 ・コードを人に見せるなら、インデントはまともにしてください。 ・Number("290") のような無駄な書き方はやめて単に "290" と書いてください。
sembokulove
sembokulove

2023/12/20 09:58 編集

fare_ten=0のfare_tenとかがそうなりますね。 試したことは、外部読み込みから内部式に変えて実験したんですが、 内部式でエラーが発生しました。 エラーを訂正したらまたエラーとなってしまい、途方にくれました。 また、fareにしているのにはもう一つ理由がございまして、 nankai、sembokuにした場合に、タグが全く別となってしまいまして、 また余計に計算するプログラムを書かないといけなくなっているからなんです。 Number("290") ⇒"290"に訂正したところ泉北側も動かなくなりました。 つまり、Nunberタグはどうやらいるようです。
int32_t
int32_t

2023/12/20 00:35 編集

> fare_ten=0のfare_tenとかがそうなりますね。 それは「変数名」です。 > まぁ、個々の回答者連中は役立たずですが。ヽ(`Д´)ﾉﾌﾟﾝﾌﾟﾝ。 では、回答は遠慮しておきます。
Lhankor_Mhy
Lhankor_Mhy

2023/12/20 00:36

HTML/CSS/Javascriptの環境で一般に「タグ」とは<div></div>などを言うと思いますが、ここでいう「タグ」とはなんのことですか？ class属性のことですか？
Lhankor_Mhy
Lhankor_Mhy

2023/12/20 00:37

おや、かぶった。
sembokulove
sembokulove

2023/12/20 00:38

すみません、タグではなく要素のことでしょうか。
Lhankor_Mhy
Lhankor_Mhy

2023/12/20 00:42

なんでいきなり回答者をコピペで叩き出したんだろ？ 直近の質問のベストアンサーは俺なんだけど、俺のせいかな？ 回答のコードの品質が悪かったのはその通りだけど、「質問のコードをなるべくいじらない」というポリシーで回答してるから、それはブーメランなんだよねえ……
Lhankor_Mhy
Lhankor_Mhy

2023/12/20 01:20

そうやって挑発するから回答がつかないのでは。 私も回答する気がなくなりましたので。
Lhankor_Mhy
Lhankor_Mhy

2023/12/20 10:04

おや、sembokulove さんのコメントが消えてる…… なんなら、回答も消えてる……運営が消したのかな……？
sembokulove
sembokulove

2023/12/21 00:34

コメントありがとうございます。⚪︎⚪︎を試しましたがまだ解決できていません。 試した結果を質問に追記しました。
sembokulove
sembokulove

2023/12/21 00:34

コメントありがとうございます。⚪︎⚪︎を試したところ問題が解決しました！ ベストアンサーに選びたいので同じ内容を回答欄に投稿いただけますでしょうか？
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.29%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

トップHTML5に関する質問

javascrpt文でバッティングしているタグがあれば、どこかご指摘をいただきたいです。