「夫を成功」へ導く妻の秘訣 座談会

下部のHTMLで
  $("#mtrig").on("click",function(){console.log("test"); } )
では発火しません。

 $("#orderlist").on("click", function(){console.log("test"); } ) や、
 $("#orderlist").on("click", ".minus", function(){console.log("test"); } )
では発火します。
最初のscriptではなぜ発火しないか理由を教えてください。

<div id="temp">
<table id = "orderlist">
<tr>
<td class="td10">name</td>
<td class="plus">+</td>
<td class="td11"> number</td>
<td id="mtrig" class="minus">-</td>
<td class="td12">sum</td>
</tr>
</table>
</div>

A 回答 (3件)

No2です。



No1の補足を見て…
>HTML最後部に<script src="lib/jquery-3.4.1.js"></script>が入っています。

ご提示のスクリプトとの実行順序が逆転していませんか?
jQueryを読込む前に実行しても、エラーになって処理されません。
わからない場合は、「発火しません。」の場合の全文をご提示いただければ、原因がわかるのではないかと思います。

…などというよりも、以下でちゃんと発火することをご確認あれ。
<!DOCTYPE HTML>
<html lang="ja">
<head><title>Sample</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.2. …
</head>
<body>

<div id="temp">
<table id = "orderlist">
<tr>
<td class="td10">name</td>
<td class="plus">+</td>
<td class="td11"> number</td>
<td id="mtrig" class="minus">-</td>
<td class="td12">sum</td>
</tr>
</table>
</div>

<script type="text/javascript">
$("#mtrig").on("click",function(){console.log("test"); } )
</script>
</body>
</html>
    • good
    • 0
この回答へのお礼

ご丁寧な回答ありがとうございます。

その後試行錯誤続け、解決ではありませんがどうやら私の実行環境依存のように思われます。
この現象が起こるのはtable tagにid(orderlist)を設定すると発生します。<table id="orderlist">を単に<table>とすれば$(#mtirg).onで発火しました。理由はわかりませんので不安ですが、
$("#orderlist").on("click", ".minus", function(){console.log("test"); } )こちらで対応しようと思います。

ありがとうございました。

お礼日時:2020/08/03 11:17

こんにちは



>最初のscriptではなぜ発火しないか理由を教えてください
発火しています。
クリックの対象が一文字なので「-」部分をちゃんとクリックしないと発火しません。

他の「発火します」のスクリプトも同様なので、多分、そのようなことは無いと思いますが、以下、念のため。
ドキュメントを読み込んだ後にご提示のスクリプトを実行していないと、イベントのバインドがうまくできませんので、見た目には「発火しない」ようになる可能性はあります。
    • good
    • 0
この回答へのお礼

もう一方の $("#orderlist").on("click", ".minus", function(){console.log("test"); } )では発火するのでちゃんとクリックはできているように思います。

お礼日時:2020/08/03 10:17

直前のjQueryを読み込むためのscriptタグをつけないから。



<script src="jq/jquery-1.7.1.js"></script>

https://otiai10.hatenablog.com/entry/2011/12/23/ …
    • good
    • 0
この回答へのお礼

HTML最後部に<script src="lib/jquery-3.4.1.js"></script>が入っています。

質問にHTML全体を書いてませんでした、済みません。

お礼日時:2020/08/03 10:14

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング