質問: サイトの管理画面でライブラリのDatatablesを使用しています。 各行毎に入力エリアがあり、保存ボタンを設置しています。 ``` 100 保存 ``` 行は動的に出力していますので、formもJSも別箇所に動的に出力しています。 ``` ~~ $("#smt100").on("click", function() { $("#desc2_100").val($("#desc1_100").val()); $("#form_100").submit(); }); ``` 最初に表示される行についてはこれで問題なく動くのですが、ページネーションをクリックし、dispay:noneで隠れていたページの行になると発火しません。 jQueryの部分をdiv#addjsで囲い、 ``` $('.paginate_button').on('click', function() { $('#addjs').load(document.URL+'#addjs'); }); ``` で行けるかな・・と思いましたが、残念ながらDatatables部分のレイアウトが崩れてしまいました。 何卒ご指南を頂きたく、お願い致します。
回答: `保存`が書きかえられた時にイベントリスナが壊れます。 詳しくは「jQuery デリゲート」あたりでググるといいと思いますが、↓あたりを読んでみてはいかがでしょうか。 > > Ajaxなどで追加した要素に対して、.clickメソッドなどでの操作は行えない。 > > jQueryで追加した要素を操作するにはon()メソッドで - Qiita > > >