-3

私のページには、 のクラスの div がたくさんありprodct-item-infoます。ユーザーがこのクラスを持つ要素をクリックするたびにいくつかのコードをトリガーするjQueryのコードがあります。

問題は、ページがこのクラスでより多くの要素を動的にロードしていることです。その場合、新しくロードされた要素のこのクラスを押しても何も起こりません。しかし、動的ロードの前に作成された要素をクリックすると、引き続き機能します。

たとえば、xはページを初めてロードしたときにロードしたもので、yは動的に追加したものです。

ページにはこれがあります：

x x x x x x x x x x x x x x x x x x

これらをクリックすると、正常に動作します。

今私はロードします：

y y y y y y y y

これらをクリックしても何も起こりません。

それを修正する方法はありますか？

前もって感謝します！

編集

ここに私のコードがあります:

$('.product-item-info').on("click",function() {
        var pid = $(this).find('input').val();
        $.get('product_info.php',{pid:pid},function(data){
            $('#product-lb').html(data).append('<span class="x"><span>X</span></span>');
            $('.x').click(function() {
                $('#dimmer').click();
            });
            $('#dimmer').css({width:$('html').width(),height:$('html').height()});
            $('#dimmer').show();
             center_div($('#product-lb'));
        });
    });
4

2 に答える 2

2

要素をどのようにターゲットにしていますか? 何かのようなもの：

$('.someClass').click(function(){
    alert('hi');
});

その場合、現在レンダリングされている要素のみがイベントを持ちます。いくつかのオプション。

1 つ目は、 jQuery を使用して要素をターゲットにしてみてくださいon()。

$("#someID").on("click", "a.someClass", function() {
    alert('Do Something);
});

または、要素を追加した後、イベントを直接適用します。

于 2013-09-15T20:24:35.483 に答える
2

on動的に追加されたコンテンツにイベントを添付/委任するために使用する必要があります。body以下の例で使用しました。と交換することもでき$(document)ます。

$('body').on('click', '.prodct-item-info', function(){
    //put your code here
});

親がある場合は、親をクリックするたびに、またはそのようprodct-item-infoに置き換える必要があります。その中のすべての子がクラスで検索され、コードが実行されます。body#parentID.parentClassprodct-item-info

于 2013-09-15T20:29:15.430 に答える