1

そのニュースの特定のトピックのすべてのニュースの見出しとコンテンツを含む 2 つの json ファイルがあります (理由は聞かないでください)。正しい内容。

それはそのように見えます：

$.ajax({
    url: 'http://website.com/news.json?=list',
    dataType: 'json',
    success: function (data) {

        $.each(data.news, function (newsId, newsHeadline) {
            $('h1').after('<h2 id="question-' + newsId + '">' + newsHeadline + '</h2>');

            $.get('http://website.com/news.json?=list&id=' + newsId, function (data) {

                $('h2').after('<div class="accordion-content">' + data.result.newscontent + '</div>');

            });

        });

    }

});

これまでのところ、ほぼ期待どおりに機能しており、見出しを読み込んでコンテンツを読み込んだ後です。

問題は、各見出しのすべてのコンテンツをロードしていることです。たとえば、最初の URL には 2 つの見出しがあります。

したがって、次のようになります。

 Headline 1
  Content 1
 Headline 2
  Content 2

しかし、代わりにそれは私に与えます:

 Headline 1
  Content 1
  Content 2
 Headline 2
  Content 1
  Content 2
4

3 に答える 3

2

ハンドラー<h2>に追加するときに、への参照を修飾していません。$.get()したがって、コンテンツはすべての <h2>要素に追加されます。

于 2012-05-17T22:11:43.257 に答える
0

データ変数を2回使用することに関係があるのではないかと思います。これを試して：

$.ajax({
    url: 'http://website.com/news.json?=list',
    dataType: 'json',
    success: function (data) {

        $.each(data.news, function (newsId, newsHeadline) {
            $('h1').after('<h2 id="question-' + newsId + '">' + newsHeadline + '</h2>');

            $.get('http://website.com/news.json?=list&id=' + newsId, function (data2) {

                $('h2').after('<div class="accordion-content">' + data2.result.newscontent + '</div>');

            });

        });

    }

});

編集：

おっと... Pointy が正しいようです。$.get()関数内の$('h2')セレクターは、ページ上のすべての h2 HTML 要素を取得しています。

于 2012-05-17T23:45:24.507 に答える
0

これは、ajax 呼び出しが非同期に機能するためです。
最初のループでは、コールバックを使用して ajax 呼び出しを行い、2 番目のループ呼び出しに進みます (ajax が完了するのを待たずに)。
ajaxコールバックは別のループ中にある可能性があるため、1-1,2-2.3-3を取得する代わりに、1-2,2-2,3-2,4-3を取得します
...同じように、ネストされた非同期コールバックではなく、線形の方法でそれを行うことを検討する必要があります。

于 2012-05-17T22:14:43.140 に答える