0

jQueryスクリプトとAJAXリクエストを含むhtmlページがあります。私のページには、「loading_span」クラスのスパン要素がいくつかあります。href をクリックすると、ajax プロセスが実行されます。そのプロセスは、クラス「loading_span」でいくつかのスパンも生成します。問題は、私の jQuery スクリプトが ajax リクエストによって新しく追加されたスパン要素をトリガーしないことです。

質問は次のとおりです。クラス「loading_span」を持つ新しい要素が追加されたことをスクリプトが認識しないのはなぜですか?

以下に、コードを貼り付けます。

/* file js/javascript.js */
$(document).ready(function() {

    $.ajaxSetup ({
        cache: false
    });

    $('#show-more').click( function() {
    $.ajax({
        url: $(this).attr('href'),
        success: function(msg){
            $('#all_span').append().html(msg);
        },
        dataType: "Html"
    });
    return false;
});


    $('.loading_span').each(function(index, span){
        console.log($(this).attr('id'));
    });
});

index.php ファイル:

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
        <script src="js/script.js" ></script>   
        <style type="text/css">
            .loading_span {
                display: list-item;
            }
        </style>
    </head>
    <body>
        <div id="all_span">
        <?php

        for($i=0;$i<5;$i++)
            echo "<span class='loading_span' id='id$i'>span$i</span>";
        ?>
            <a href="ajax.php" id="show-more">show_more</a>
        </div>
    </body>

および ajax.pho ファイルの内容

for ($i = 0; $i < 5; $i++)
    echo "<span class='loading_span' id='ajax$i'>ajax$i</span>";
4

3 に答える 3

1

after 要素を使用して、loading_span の後に要素を追加できます。

Javascript 部分のみについては、以下の URL を参照してください。 http://jsfiddle.net/vkTHK/1/

あなたが何を達成しようとしているのか、私はまだ理解できません。それがあなたのニーズを満たさない場合は、部分的に詳しく説明するか、JS フィドルの URL を提供してください。

于 2012-07-15T14:34:09.787 に答える
1

使用する必要があります

$('#all_span').append(msg);

それ以外の

$('#all_span').append().html(msg);

成功のコールバックを次のように変更します

success: function(msg){
        $('#all_span').append(msg);
        $('.loading_span').each(function(index, span){
            console.log($(this).attr('id'));
        });
},
于 2012-07-15T17:49:16.787 に答える
0

AJAX$('.loading_span').each...呼び出しが終了する前に実行されているため、実行していることを実行しています。そのコードをsuccessAJAX 呼び出しのイベントに移動して、新しい要素が DOM に追加されたときに適用されるようにすることができます。

于 2012-07-15T17:28:01.363 に答える