1

ニュースフィードを実装しようとしています。ページが最初に 20 のニュース項目を読み込み、友人の写真データなどが読み込まれ、すべてがうまくいきます。

次に、ユーザーが自分のステータスを更新したときに、これと新しい友達のステータスをニュースフィードに表示したいと思います。これは私が動的に作成したい構造です

...
<div id="doNews" class="colwrap st-leftmenu">
  <ul id="theNews" class="newsList">
      <li class="newsItem">
          <div class="st-col2">
            <img class="newsImage" src="profile/16/images/thumb/cloth.gif">
            </img>
          </div>   
          <div class="st-col1">
            <div class="st-name">John Smith</div>
            <!-- other user status divs -->
          </div>
      </li>
      <!-- other lis -->
  </ul>

imgそして、このjQueryでパーツを作成できました:

function showStatus(data){
    var jsondata = $.parseJSON(data);
    $('#doNews').empty();
    $('#doNews').append($('<ul/>', {"class": "newsList", id: "theNews"}));
    $.each(jsondata, function(i, item){
        $('<img src="' + showpic(item[3]) + '" class="newsImage">')
            .load(function(){
        $(this)
            .appendTo($('#theNews'))
            .wrap($('<li>', {"class": "newsItem"}))
            .wrap('<div class="st-col2">');
      });
});
//  $('#theNews li').each(function(){
//      $(this).append($('<div>', {"class": "st-col1"}));
//  });

$("#statustext").val('');
}

ただし、コメントアウトされた部分は機能していないようです (b/C ページは既に読み込まれていますか?) そして、それを load 関数に入れると、<div class="st-col1">私が望むものではない img に添付されます。

4

2 に答える 2

1

li画像読み込みコールバックで を作成しdivて、liそこに を追加します。

$('<img src="' + showpic(item[3]) + '" class="newsImage">')
    .load(function(){
        $(this)
            .appendTo($('#theNews'))
            .wrap($('<li>', {"class": "newsItem"}))
            .wrap('<div class="st-col2">')
            .closest('li')
            .append($('<div>', {"class": "st-col1"}));
      });
});
于 2013-07-15T02:38:36.700 に答える