JS onloadについて

javascriptにて
複数要素からfunctionへ値を飛ばしていますが、うまく動く場所と動かない場所があります。

HTML
1<head>
2<script>
3function shori(data_a,data_b){
4if(data_a == "456"){
5    alert("ok");
6}
7
8-処理（ajax)-
9}
10</script>
11</head>
12
13<body>
14<ul>
15<li><img src="**" onload="shori('123','456')"></li>
16<li><img src="**" onload="shori('456','123')"></li>
17<li><img src="**" onload="shori('321','654')"></li>
18<li><img src="**" onload="shori('213','546')"></li>
19</ul>

liのいくつかが処理できていない・・ような状況です。
読み込めない部分をif(data_a == "456"){　という形で中に入っているか確認したところ反応しませんでした。
このliは全部で100行程度あります。

読み込み順など関係しますでしょうか？

また、onload=shori(**)を、imgではなくliに入れたいのですが、liに入れると動きません。liで動かすようにするためにはどうしたらいいでしょうか？

よろしくお願い致します。

行動規範の内容に同意します

回答1件

ベストアンサー

読み込めない部分をif(data_a == "456"){　という形で中に入っているか確認したところ反応しませんでした。

この現象が再現できません。
alert("ok")をconsole.log(data_a)とかに置き換えて開発者ツールで見ても反応していないでしょうか？

確認したコード

js
1function shori(data_a,data_b){
2  if(data_a == '456'){
3    alert("ok");
4  }
5  console.log('a:' + data_a + ', b: ' + data_b);
6}

また、onload=shori(**)を、imgではなくliに入れたいのですが、liに入れると動きません。liで動かすようにするためにはどうしたらいいでしょうか？

これは出来ません。imgタグのonloadは画像の読み込み完了に対するイベントなので、liタグとは関係ないです。
仮にliに書けた場合のメリットが見えないのですが何か理由があるのでしょうか？

投稿2021/01/23 11:22

編集2021/01/23 11:31

退会済みユーザー

総合スコア0

tso

2021/01/23 12:34

再現までしていただいて、ありがとうございます。console.logに入れてみたところ、理由が画像自体が無いためということがわかりました。liの件もですが、タグを読み込んだ後発動するものと思っておりました。 liにつけたい理由としては、・li自体を条件によって非表示にしたい・こちらのソースには記載しませんでしたが、条件によってli内のテキストも変更したい・liのクラス名が動的に変わるのでliのクラスを見て処理を行いたい・画像が無い場合に別の画像を読み込みたいので、liから関数を呼び出せないかなと思っています。

tso

2021/01/23 13:17

liの件は li内に　<script>shori(x,x)</script>の記載で無事動きました。あまり理解せずにハマってましたが、解決の糸口になりました。ありがとうございます。

退会済みユーザー

2021/01/24 11:15

それは良かったです。これからも頑張ってください。

行動規範の内容に同意します