LoginSignup
2

More than 5 years have passed since last update.

コンテナにclickハンドラ付ければ要素毎につける必要は無い

Posted at

HTMLはこんな感じ

<ul>
  <li data-id="1">push</li>
</ul>

増えていくliに対してclickハンドラ付けたい場合、
今まで愚直に$('li').on('click', function() {})
を毎回やっていたけど、今日もっと良い方法を知った

let seq = 1;
$('ul').on('click', 'button', function() {
  $('ul').append('<li data-id="' + (++seq) + '">push</li>');
});

コンテナの方にclickハンドラを付けて、
on()の第二引数にセレクタを追加してやれば、li毎にハンドラを設定しなくても良い

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2