[解決済み] 動的に生成される要素にdatepicker()を置く - JQuery/JQueryUI

質問

テキストボックスを動的に作成し、クリックするとカレンダーが表示されるようにしたいです。私が使用しているコードは次のとおりです。

$(".datepicker_recurring_start" ).datepicker();

すべてのテキストボックスがdatepicker_recurring_startというクラスを持っているにもかかわらず、これは最初のテキストボックスに対してのみ動作します。

あなたの助けはとてもありがたいです!

どのように解決するのですか？

その方法は以下のとおりです。

$('body').on('focus',".datepicker_recurring_start", function(){
    $(this).datepicker();
});​

デモ

この $('...selector..').on('..event..', '...another-selector...', ...callback...); という構文が意味します。

リスナーを追加して ...selector.. (その body この例では)イベント ..event.. ('focus'、この例では)。セレクタにマッチするノードの全ての子孫に対して ...another-selector... ( .datepicker_recurring_start の例では) 、イベントハンドラを適用します。 ...callback... (この例ではインライン関数)

参照 http://api.jquery.com/on/ を、そして特に "委譲されたイベント" についてのセクションをご覧ください。