3

ページ内により多くのコンテンツを読み込むために、jQuery.get() 関数を使用して外部ページ リンクを取得しています。

すべてのページを取得できますが、結果をフィルタリングして ".container_journal_post" div のみを取得しようとすると、うまくいきません。あなたの助けは大歓迎です。

これが私の現在のHTMLコードです：

<div id="related_projects" class="gridalicious">
    <article><div class="container_journal_post"> post 1 </div></article>
    <article><div class="container_journal_post"> post 2 </div></article>
</div>

これが私の外部ページのHTMLコードです:

<div id="related_projects" class="gridalicious">
    <article><div class="container_journal_post"> post 34 </div></article>
    <article><div class="container_journal_post"> post 35 </div></article>
</div>

ここに私のJavaScript関数があります:

jQuery(document).ready(function($) {
    var pageNum = parseInt($("#current_page")[0]["innerHTML"]);
    // Get the page number 
    var max = parseInt($("#max_num_pages")[0]["innerHTML"]);
    // Get the maximum number of the blog section.
    var nextLink = $("#pagination .next")[0]["href"];
    // Get The link of the next page of posts.

    // A button where the user is cliking to load more posts
    $('#append').click(function(){
        makeboxes();
    }); 

    makeboxes = function() {
        var boxes = new Array;

        $.get(nextLink, function(data) {
           // console.log(data);
           // Return the "nextLink" HTML DOM
           // Can't cut it correctly 
           // console.log($(data));
           // Return 100 items

           // I would like to get something like this:
                $(data).filter( 'article' ).each(
                function( key, value ) { 
//                  value has to be equal at 
//                  <div class="container_journal_post"> post 34 </div>
                    boxes.push(value);
                }

            );
            // load at the end of the div the new boxes
            jQuery( "#related_projects" ).gridalicious( 'append', boxes );
        });
    }
});

「makebox」関数が呼び出された後に必要な結果:

<div id="related_projects" class="gridalicious">
    <article><div class="container_journal_post"> post 1 </div></article>
    <article><div class="container_journal_post"> post 2 </div></article>
    <article><div class="container_journal_post"> post 34 </div></article>
    <article><div class="container_journal_post"> post 35 </div></article>
</div>
4

1 に答える 1

0

jquery の load 関数を使用できます。

$('#result').load('ajax/test.html #container'); 一方#container、フェッチされるコンテンツのセレクターです

( jquery ロードのドキュメントを参照)

于 2013-04-30T17:09:22.130 に答える