javascript - JavaScriptで作成した要素をfadeOutできない

Question

クリックすると角丸長方形がフェードアウトするようにしようとしています..なぜそれが機能しないのか知っていますか? フィドルに移動し、「+」アイコンをクリックして 16 進コードを入力し、右上の「x」を使用して終了し、色の丸い長方形をクリックしようとすると、フェードアウトしません。 . 要素は明らかにjsで作成されます。

http://jsfiddle.net/DmYny/1/

これは動作したくないコードです::

$('.color').on('click', function(){
            $(this).fadeOut(300);
        });

Answer 1

クリック ハンドラーは、jQuery 関数の実行時に存在するすべての一致する要素に適用されます。.colorその後、クラスを使用して新しいボックスを作成すると、ハンドラーが適用されません。

これを試して：

$('body').on('click','.color', function(){
        $(this).fadeOut(300);
    });

bodyこれにより、要素からハンドラーが委任されます。委任するのに最適な場所ではありません。おそらく、影響を受ける要素に近いコンテナから委任することをお勧めします。