+ JavaScript の質問用スレッド vol.126 + [転載禁止]©2ch.net (742レス)
+ JavaScript の質問用スレッド vol.126 + [転載禁止]©2ch.net http://mevius.5ch.net/test/read.cgi/hp/1439005423/
上
下
前
次
1-
新
通常表示
512バイト分割
レス栞
281: Name_Not_Found [sage] 2022/07/27(水) 14:34:05.59 ID:??? setTimeout()で解決しました。おさわがせしました。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/281
282: Name_Not_Found [] 2022/08/03(水) 18:48:40.22 ID:Nj6BOTMG <!DOCTYPE html> <html> <head> <script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script> <title>サンプル</title> </head> <body> <input type="button" value="再生" id="button"> <script> if ($('#button').val() === "再生"){ $('#button').click(function() { console.log($('#button').val()); console.log($('#button').val() === "再生"); console.log("再生をはじめました。"); $('#button').val('停止'); }); } </script> </body> </html> 今すっごくハマっているところですが、input要素のvalue値を変化させると、ボタンをクリックさせないように設定しているのですが、 そんなの関係なしに、ボタンがクリックできてしまいます。 これは、どういった理由で変な処理が可能になっているのでしょうか?今後ハマらないためにどのような注意をすればよいでしょうか? http://mevius.5ch.net/test/read.cgi/hp/1439005423/282
283: Name_Not_Found [] 2022/08/03(水) 20:01:54.34 ID:Nj6BOTMG <!DOCTYPE html> <html> <head> <script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script> <title>サンプル</title> </head> <body> <input type="button" value="再生" id="button"> <script> var playing_flag = false; if (playing_flag === false){ $('#button').click(function() { console.log('ボタンが押された'); console.log(playing_flag); $('#button').val('演奏中止'); playing_flag = true; console.log(playing_flag); // run(); }); }else{ console.log(playing_flag); // reset(); } </script> </body> </html> flag用の変数を使ってもダメだった。どこで躓いているんだろ。。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/283
284: Name_Not_Found [sage] 2022/08/03(水) 20:12:43.40 ID:??? こういうこと? ボタンを無効化させる意図がよく分からんけど disableかstyleのpointer-eventかければいいだけかと https://i.imgur.com/Nf7k076.jpg http://mevius.5ch.net/test/read.cgi/hp/1439005423/284
285: Name_Not_Found [] 2022/08/03(水) 20:17:43.28 ID:Nj6BOTMG もちろん、もともとの目的は無効化なんだけど。 それより、 if(false){ 実行A } の状態なのに、実行Aが実行されているのが気になって。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/285
286: Name_Not_Found [sage] 2022/08/03(水) 20:22:18.94 ID:??? false === false は真だろ http://mevius.5ch.net/test/read.cgi/hp/1439005423/286
287: Name_Not_Found [] 2022/08/03(水) 20:23:51.02 ID:Nj6BOTMG お。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/287
288: Name_Not_Found [sage] 2022/08/03(水) 20:27:15.89 ID:??? そっかー。ありがとう。これに2時間悩んでたww http://mevius.5ch.net/test/read.cgi/hp/1439005423/288
289: Name_Not_Found [] 2022/08/03(水) 20:32:11.88 ID:Nj6BOTMG いや。解決してない。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/289
290: Name_Not_Found [] 2022/08/03(水) 20:36:38.79 ID:Nj6BOTMG <script> var playing_flag = false; if (playing_flag === false){ $('#button').click(function() { console.log('ボタンが押された'); console.log(playing_flag); $('#button').val('演奏中止'); playing_flag = true; console.log(playing_flag); // run(); }); }else{ console.log(playing_flag); console.log('2回目はこっちが押されるはずでは?'); // reset(); } </script> 1回目のクリックは、if文の実行で問題ないのだけど。 2回目のクリックは、else文を実行するのでは? http://mevius.5ch.net/test/read.cgi/hp/1439005423/290
291: Name_Not_Found [] 2022/08/03(水) 20:48:32.41 ID:Nj6BOTMG <input type="button" value="再生" id="button"> <script> var playing_flag = false; const btn = document.getElementById("button"); var run = () => { console.log(playing_flag); console.log("再生中"); playing_flag = true; }; var reset = () => { console.log(playing_flag); console.log("停止"); playing_flag = true; }; if (playing_flag === false) { btn.addEventListener("click", run, false); } else { btn.addEventListener("click", reset, false); } </script> jQueryが悪いのかと思って、イベントリスナーでクリックしてみたけど。 やっぱり2回目のクリックでelse文を実行しない。 なんか、おれ勘違いしてる???? http://mevius.5ch.net/test/read.cgi/hp/1439005423/291
292: Name_Not_Found [] 2022/08/03(水) 20:52:18.36 ID:Nj6BOTMG ちょっと訂正。 var reset = () => { console.log(playing_flag); console.log("停止"); playing_flag = true; }; ↓ var reset = () => { console.log(playing_flag); console.log("停止"); playing_flag = false; }; http://mevius.5ch.net/test/read.cgi/hp/1439005423/292
293: Name_Not_Found [sage] 2022/08/03(水) 20:53:44.88 ID:??? その2回通ると思い込んでるif文はイベントハンドラでも何でもないんだからボタン押される前の1回しか通らないよ http://mevius.5ch.net/test/read.cgi/hp/1439005423/293
294: Name_Not_Found [] 2022/08/03(水) 21:00:45.56 ID:Nj6BOTMG え。意味がよくわからない。イベントハンドラじゃないから、1回しかとおらない。。?? http://mevius.5ch.net/test/read.cgi/hp/1439005423/294
295: Name_Not_Found [] 2022/08/03(水) 21:13:35.85 ID:Nj6BOTMG ずっとコードを眺めてみたら、 >>290のコードは確におかしいことは分かってきた気がする。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/295
296: Name_Not_Found [sage] 2022/08/03(水) 21:37:07.14 ID:??? >>291,292のコードも、イベントリスナー使ってますけど。 2回クリックしてもelse文にはならず、if文を2回実行しているのでしょうか? http://mevius.5ch.net/test/read.cgi/hp/1439005423/296
297: Name_Not_Found [] 2022/08/03(水) 21:56:45.64 ID:Nj6BOTMG playing_flag = false; var run = () => { if(playing_flag === false){ console.log(playing_flag); console.log("再生中"); playing_flag = true; }else{ reset(); } }; var reset = () => { console.log(playing_flag); console.log("停止"); playing_flag = false; }; const btn = document.getElementById("button"); btn.addEventListener("click", run, false); 納得いかないけど、>>291,292を上のように変えたら、 期待した通りに動いた。 ボタンの状態に、フラグをつけて、実行に条件を入れるときは注意しないと いけんのかもなあ。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/297
298: Name_Not_Found [sage] 2022/08/03(水) 22:04:04.33 ID:??? 納得いかない、ねえ? 開発者ツールでどういう順番でどの行の処理がされるか確認したらいいんじゃないかな http://mevius.5ch.net/test/read.cgi/hp/1439005423/298
299: Name_Not_Found [] 2022/08/03(水) 22:07:55.84 ID:Nj6BOTMG あ。そうですね。アドバイスありがとうございます。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/299
300: Name_Not_Found [sage] 2022/08/03(水) 22:12:13.92 ID:??? >>297 むしろ、>>291でフラグ立ててイベントハンドラ振り分けてるのが最高に意味不明なんだが イベント駆動について勉強してみたら? http://mevius.5ch.net/test/read.cgi/hp/1439005423/300
上
下
前
次
1-
新
書
関
写
板
覧
索
設
栞
歴
あと 442 レスあります
スレ情報
赤レス抽出
画像レス抽出
歴の未読スレ
AAサムネイル
Google検索
Wikipedia
ぬこの手
ぬこTOP
0.009s