イベントを追加さ​​れた要素にバインドする方法はありますか？

Question

jqueryエフェクトfadeToを使用してエラーメッセージを表示しようとしましたが、ボタンを追加してフェードアウトを使用してメッセージを非表示にしようとしましたが、動作しないようです。私が何をしたか

されました：

$("#sub_error") 
    .fadeTo(200, 0.1, function() 
    { 
    $("#sub_error") 
     .html(error.join("<br/><br/>")) 
     .append('<br/><input type="button" name="err_ok" id="err_ok" value="ok">') 
     .addClass('subboxerror') 
     .fadeTo(900,1); 
    }); 

$("#err_ok").click(function() 
{ 
    $("#sub_error").fadeOut("slow"); 
}); 

は私が間違って何をやっている、誰かが私を助けることができますか？

Answer 1

最初に#err_ok要素が存在しないため、.click（）ハンドラは適用されません。

あなたは、関数の中で

$("#err_ok").click(function() { 
    $("#sub_error").fadeOut("slow"); 
}); 

を置くことによってこの問題を解決し、DOMで要素を作成した後に関数を呼び出すことができます。

編集：これは完全な解決策になるはずです：あまりにもDOM要素を作成し、将来にイベントを結合する「live」機能もあります

$("#sub_error").fadeTo(200, 0.1, function() { 
    $("#sub_error") 
     .html(error.join("<br/><br/>")) 
     .append('<br/><input type="button" name="err_ok" id="err_ok" value="ok">') 
     .addClass('subboxerror') 
     .fadeTo(900, 1); 
    bindEvents(); 
}); 

function bindEvents() { 
    $("#err_ok").click(function() { 
     $("#sub_error").fadeOut("slow"); 
    }); 
} 

。

Answer 2

FWIWでは、JQueryバグトラッカーのfadeTo/fadeOutバグに関するチケットが提出されています。

Answer 3

これを行うにはいくつかの方法があります。それが挿入された後、一つは、あなたが要素にクリックハンドラを追加することができます

$("#sub_error").fadeTo(200, 0.1, function() { 
    $("#sub_error") 
     .html(error.join("<br/><br/>")) 
     .append('<br/><input type="button" name="err_ok" id="err_ok" value="ok">') 
     .addClass('subboxerror') 
     .fadeTo(900, 1) 
     .find('#err_ok') 
     .click(function() { 
     $("#sub_error").fadeOut("slow"); 
     }); 
}); 

または2を、それはだ時はいつでも「err_ok」idを持つ任意の要素は、クリックハンドラを取得するように、あなたはライブイベントハンドラを使用することができます作成した。

$('#err_ok').live('click', function() { 
    $('#sub_error').fadeOut('slow'); 
});