+ JavaScript の質問用スレッド vol.126 + [転載禁止]©2ch.net (740ﾚｽ)

+ JavaScript の質問用スレッド vol.126 + [転載禁止]©2ch.net http://mevius.5ch.net/test/read.cgi/hp/1439005423/

上下前次1-新
通常表示 512ﾊﾞｲﾄ分割 ﾚｽ栞
抽出解除 必死ﾁｪｯｶｰ(本家) (べ) ﾚｽ栞 あぼーん

---

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

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

287: Name_Not_Found [] 2022/08/03(水) 20:23:51.02 ID:Nj6BOTMG お。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/287

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＞ １回目のクリックは、if文の実行で問題ないのだけど。 ２回目のクリックは、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が悪いのかと思って、イベントリスナーでクリックしてみたけど。 やっぱり２回目のクリックで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

294: Name_Not_Found [] 2022/08/03(水) 21:00:45.56 ID:Nj6BOTMG え。意味がよくわからない。イベントハンドラじゃないから、１回しかとおらない。。？？ 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

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

299: Name_Not_Found [] 2022/08/03(水) 22:07:55.84 ID:Nj6BOTMG あ。そうですね。アドバイスありがとうございます。 http://mevius.5ch.net/test/read.cgi/hp/1439005423/299

301: Name_Not_Found [] 2022/08/03(水) 22:42:39.79 ID:Nj6BOTMG よくわかってなかったようだ。 下の認識でOKですか？雑ですが。。 「Javascriptはブラウザが開いたとき、上の行から下の行へ基本一回だけ実行する。 しかし、イベントが起きたら例外的にその箇所を実行する。」 http://mevius.5ch.net/test/read.cgi/hp/1439005423/301

---

上下前次1-新書関写板覧索設栞歴

---

ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ

---

Google検索

Wikipedia

---

ぬこの手 ぬこTOP 1.262s*