動的に生成される入力/ボタンのイベントハンドラをクリックしますか？

Question

静的なボタンとAjaxで生成されたボタンのクリックを正確に同じコードで処理できますか？私が尋ねる理由は、Ajaxボタンのためにクリックハンドラを動作させることはできませんが、同等の静的HTMLを記述すると、クリックが機能します。 "静的なHTML" では

// in JS file: 
$(function(){ 
    $('input.sButton').click(function(){ 
     var f = $.farbtastic('#picker'); 
     f.linkTo(this); 
     return false; 
    }); 
}); 

：

このコードは、作業を行い、静的なバージョンです

<div id = "inputArea"> 
<label style="white-space: nowrap; line-height: 14px; height: 14px; vertical-align: bottom;"> 
<input id="sButton1" class="sButton" type="button" style="background-color: rgb(113, 16, 232);"> 
fubar1 
</label> 
</div> 

通常の "ダイナミックHTMLは" 次のようになります。

<div id = "inputArea"> 
</div> 

Ajaxコードはボタンを 'inputArea'に読み込みます。私はFirebugからこのコードの静的バージョンを得ました。私はAjaxルーチンを走らせ、サーバー出力を含むFirebugでHTMLビューを取得し、それを上に再現した静的テストコードにカットアンドペーストしました。言い換えれば、私は静的で動的なHTMLは同等であることを知っています。

しかし、静的コードは機能し、動的コードは機能しません。 Firebugは、静的バージョン用にJSクリックハンドラが入力されていることを示しています。遠隔地のカラーピッカーがポップアップしますが、これは動的コードでは発生しません。何か案は？

Answer 1

$('input.sButton').live('click', function(){ 
     var f = $.farbtastic('#picker'); 
     f.linkTo(this); 
     return false; 
    }); 

.liveは、Ajaxコンテンツでも聞きます。 Thsiはトリックを行う必要があります。また、jquery .on（）を調べることもできます。最新のjqueryを使用していることを確認してください。

Answer 2

jQueryのlive機能だけで、その目的のためにそこにある、あなたはjqueryの1.7以降を使用している場合、それはhere

Answer 3

、代わりにクリック

http://api.jquery.com/on/

$("body").on("click","input.sButton",function(){ 
//do whatever you want 
}); 

のにを使用してチェックアウトjqueryの下位バージョンを使用している場合は、ライブを使用する

$('input.sButton').live("click",function(){ 
//do whatever you want 
});