ブログ BLOG Home Blog #よく忘れる jQueryで要素を追加した時の挙動と反応と対処 よく忘れちゃうから、備忘録に書いておく。jQueryでボタン等、要素を追加した時に追加したボタンにも同じfuncitonを適応したい場合の書き方。※ $(document).ready();は最初に読み込まれた時、その場にある要素にしか対応していない。例えば、btnと言うclass名のボタンを押したら同じclass名のボタンが押せば押すほど増えるしかし、最初に読み込まれた最初のclass名btnのみしかclickアクションは反応しない。例を書くこういったコードだと、最初に表示されたclass名btnにしか反応しない。「追加ボタン」もclass名はbtnだが、このfunctionは反応しない。じゃぁ、よく忘れるこの場合の対処法。$('#btn_area').on('click', '.btn', function(){});これは、簡単に書くと$('#btn_area')の子要素(.btn)を指定して反応させるってこと。見てる限りの処理としては、$('#btn_area')内が押された時に、この親要素の中にある子要素をもう一度見見直すんでしょう。んで、selectorとして指定してる(.btn)を見ると増えてるから、こいつらも同じ処理をさせるって感じでしょうな。この書き方よく使うのに、よく忘れるんですよね〜 #jQuery #よく忘れる #要素追加 #よく使う 2016-08-08 記事をもっと見る
jQueryで要素を追加した時の挙動と反応と対処 よく忘れちゃうから、備忘録に書いておく。jQueryでボタン等、要素を追加した時に追加したボタンにも同じfuncitonを適応したい場合の書き方。※ $(document).ready();は最初に読み込まれた時、その場にある要素にしか対応していない。例えば、btnと言うclass名のボタンを押したら同じclass名のボタンが押せば押すほど増えるしかし、最初に読み込まれた最初のclass名btnのみしかclickアクションは反応しない。例を書くこういったコードだと、最初に表示されたclass名btnにしか反応しない。「追加ボタン」もclass名はbtnだが、このfunctionは反応しない。じゃぁ、よく忘れるこの場合の対処法。$('#btn_area').on('click', '.btn', function(){});これは、簡単に書くと$('#btn_area')の子要素(.btn)を指定して反応させるってこと。見てる限りの処理としては、$('#btn_area')内が押された時に、この親要素の中にある子要素をもう一度見見直すんでしょう。んで、selectorとして指定してる(.btn)を見ると増えてるから、こいつらも同じ処理をさせるって感じでしょうな。この書き方よく使うのに、よく忘れるんですよね〜 #jQuery #よく忘れる #要素追加 #よく使う 2016-08-08