0

私の問題はおそらくこのフィドルから最も簡単に説明できます：http：//jsfiddle.net/L3zVY/7/

ボックスの右上にある画像をクリックすると、ボックスが消えていきます（画像は表示されないため、疑問符にすぎません）。

これらのボックスをハードコーディングする代わりに動的に操作しようとすると、この機能は何らかの理由で失われます。

このようにしているのは、エラーメッセージに応じてクラスを変更するボックスを使用したログインページがあるためです。ボックスを閉じることができることを除いて、すべてが正常に機能します...

何か案は？

コード：

$(document).ready(function() {
// Close notifications (fade and slideup)

        $(".notification a.close").click(function () {
            $(this).parent().fadeTo(400, 0, function () {
                $(this).slideUp(200);
            });
            return false;
        });


// JQuery Broken Notification:
    $("#msgbox1").html('Broken :( <a href="#" class="close"><img src="images/notification_close.png" alt="close" /></a>');

});
4

2 に答える 2

2

ハンドラーを割り当てるときclick、挿入する要素はまだ存在しないため、jQuery はそれを見つけることができません。

最初に要素を挿入します。

$(document).ready(function() {
    $("#msgbox1").html('...');
    $(".notification a.close").click(...);
});

または使用.live()/ .delegate():

$(document).ready(function() {
    $(".notification").delegate('a.close', 'click', function(){...});
    $("#msgbox1").html('...');
});

イベント ハンドラーは常に要素にバインドされます。存在しないものに何かをバインドすることはできません。live/イベントハンドラーを DOM ツリーのさらに上にバインドし (イベントのバブリングが原因である可能性があります)、イベントのターゲットをチェックするdelegateことで、この問題を解決します。

于 2011-05-29T12:59:00.837 に答える
1

http://jsfiddle.net/L3zVY/8/ jquery で live() 関数を使用する必要があります。

于 2011-05-29T12:59:15.720 に答える