jQuery - ページの読み込み時に隠されている要素の中にfadeOut（）ボタンを置く方法は？

Question

私は2つのシンプルなスクリプトを持っていますが、最初はdivをクリックすると表示されます。そのdivの中にはクローズボタン（非常に基本的なモーダルウィンドウ）があります。 qrTooltip divは、デフォルトで非表示になっています（display：none）。私は上に表示することができますが、クローズ機能は動作しません。私は、マークアップはjQueryのためにページがロードされるときにマークアップが存在しなければならないと仮定しています。また、divが隠されているため、アンカーにjQueryコードが追加されることはありません。

これを回避する方法はありますか？

<script language="javascript"> 
$('#btnQr').click(function() { 
    $('#qrTooltip').fadeToggle('fast', function() { 
    // Animation complete 
    }); 
}); 
</script> 

    <script language="javascript"> 
    $('#btnQrClose').click(function() { 
     $('#qrTooltip').fadeOut('fast', function() { 
     // Animation complete 
     }); 
    }); 
    </script> 

<a href="#" id="btnQr">show</a> 


<div id="qrTooltip"> 
<a href="#" id="btnQrClose">hide</a> 
</div> 

Answer 1

ボタンが存在する前にあなたのJavascriptが評価されているからです。

<script language="javascript"> 
$(function(){ 
    $('#btnQrClose').click(function() { 
     $('#qrTooltip').fadeOut('fast', function() { 
      // Animation complete 
     }); 
    }); 
}); 
</script> 

Answer 2

jQuery .live()イベントを使用してください。ここをクリックしてください：http://api.jquery.com/live/