• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:jQuery 動的にボタンが増えた時)

jQueryで動的にボタンを追加した時の対応方法

このQ&Aのポイント
  • jQueryを使用してボタンを動的に追加する際の対応方法について解説します。button_cls_1やbutton_cls_2だけでなく、button_cls_3やbutton_cls_4など、複数のボタンに対応する方法も紹介します。
  • HTMLとjQueryを使ってボタンを動的に追加する方法を解説します。button_cls_1やbutton_cls_2だけでなく、button_cls_3やbutton_cls_4など、さまざまなボタンに対応できるコードの書き方も紹介します。
  • button_cls_1やbutton_cls_2が動的に追加されたときの対応方法について解説します。HTMLとJavaScriptを組み合わせて、ボタンが増えたときにも正しく動作するようにする方法を紹介します。また、button_cls_3やbutton_cls_4にも対応する方法も説明します。

質問者が選んだベストアンサー

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

何をもって対象のボタンと判断するのか条件が不明なので、適当に… <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>test</title> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery","1.5.0");</script> <script type="text/javascript"> <!-- $(document).click(function(e){ var t = e.target, m = $(t).attr("class").match(/(?:^| )button_cls_(\d+)(?: |$)/); if(t.nodeName=="INPUT" && t.type=="button" && m) alert("hello world! button " + m[1]); }); //--> </script> </head> <body> <div> <input class="button_cls_1" type="button" value="テスト1"> <input class="button_cls_2" type="button" value="テスト2"> </div> </body> </html> しかし、想像するところ同じ構成のボタンなのでしょうから、class名を分ける必要はないように推測します。 そうすれば(↑)のような面倒なことをしなくても、$(".クラス名")で一括指定が可能だし、後から動的に追加される要素があるとしても(あるのか無いのか不明ですが)、live()が用意されているのでそれを用いれば良さそう。

関連するQ&A

専門家に質問してみよう