Q&A
ご自身で試されたコードを質問文に追記し、「何」が「どのように」わからないのか、コードのどの部分で詰まっているのかなどを具体的に追記されたほうが回答が望めると思います。
PHP+JavaScript&jQueryで業務ページ作成中です
dbから値を持ってきて PHPで表示している部分では
HTML側で設定している
<input type="button" class="classname" value="削除">
としているところでは
jQueryの
$('#classname').on('click', function() {
~処理
});
の処理が正しく呼ばれて処理されますが
Javascriptで作成した htmlのテキストを
目的の場所の前に
insertBefore
した行だと クリックイベントが起こらず jQueryのfunctionが呼ばれません
html内にあるテンプレートをobjectで取得し insertBeforeした場合には
functionも呼ばれるのですが
.html()で取り出し中身を書き換えたり
javascript内で
template='<html><body><input type="button" class="classname" value="削除">
と記述したものなど
テンプレートの中身を書き換えたいので手作りするとボタンが効かなくなります
texthtmlがあったとして
テキストをオブジェクトにキャストする方法で
object=$(text)
はやってみましたが実現できませんでした
いったんinnerHTMLで出力し 取得する方法でもうまくいきませんでした
http://d.hatena.ne.jp/yatt/20090409/1239292833
（参考ページ)
どなたか解決策を教えていただければ幸いです
回答2件
0
ベストアンサー
後から動的に追加したDOMでイベントを起こしたい場合は、次のように書いてみてください。
JavaScript
1$('body').on('click', '.classnameもしくは#idname', function() { 2 //~~some actions~~ 3});
投稿2018/01/21 17:09
総合スコア60
追加する部分にいくつかボタンがあり その中で id名が数字が増えてきって特定できないのですが
これは どこに記述すればよいのでしょうか
既存のボタンのfunctionを教えていただいたように記述を変更しましたら 動作するようです
正しい結果になっているか十分な調査はまだ行っておりませんが、とりあえず、試してみたボタンは動作いたしました。
idが増えるようであれば、指定する際に前方一致を使うことで対応可能かと思います。
そのあたりは、普通のクラスやidの指定と同様に捉えて頂いて良いと思います。
教えていただいた方法で、問題を解決しました。
まだ別の課題はありますが、本件については、これで終了します
回答ありがとうございました
0
パフォーマンスを気にしないのであれば、下記のようにイベント監視する事で動的に作成したDOMに対してもイベントを実行できるようになります。
$(document).on('click', '.指定クラス', function(){ // 処理 });
投稿2018/01/22 00:56
総合スコア68
パフォーマンスは重視するので、お知らせいただいた内容は採用しませんが、回答ありがとうございます
いやいや、パフォーマンスならほかの回答と大差ないと思いますが。
あなたの回答
tips
プレビュー
