2016-04-11 11 views
0

次のJSコードを使用してRSSを表示しようとしています。しかし、これを実行すると、両方のRSSフィードが同じコンテンツ(後で実行されるもの)に変更され、すべてのフィードが同じdivに追加されます。私はrss = thisが問題を引き起こしていると思う。回避策はありますか?RSSフィードのコンテンツを別の部門に追加

HTML:

<div id="rss1" class="rss-widget"> 
     <ul></ul> 
</div> 
<div id="rss2" class="rss-widget"> 
     <ul></ul> 
</div> 
<div id="rss3" class="rss-widget"> 
     <ul></ul> 
</div> 

JS:

function RSSWidget(id, url) { 

rss = this; 
rss.FEED_URL = url; 

rss.JSON = new Array(); 
rss.widgetHolder = $('#' + id + ' ul '); 
rss.storiesLimit = 15; 

rss.renderBlogItem = function (object) { 
    var item = '<li class="blog-item">'; 
    item += '<a href="' + object.link + '">'; 
    item += '<div class="blog-item-title">' + object.title + '</div>'; 
    item += '<div class="blog-item-author">' + object.author + '</div>'; 
    // item += '<div class="blog-item-content">' + object.content + '</div>'; 
    item += '</a>' 
    item += '</li>'; 

    rss.widgetHolder.append(item); 
} 

return $.ajax({ 
    url: 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=' + encodeURIComponent(rss.FEED_URL), 
    dataType: 'json', 
    success: function (data) { 
     if (data.responseData.feed && data.responseData.feed.entries) { 
      $.each(data.responseData.feed.entries, function (i, e) { 
       rss.JSON.push({ //add objects to the array 
        title: e.title, 
        author: e.author, 
        content: e.content || "", 
        link: e.link 
       }); 
      }); 

      if (rss.storiesLimit > rss.JSON.length) 
       rss.storiesLimit = rss.JSON.length; 

      for (var i = 0; i < rss.storiesLimit; i++) { 
       rss.renderBlogItem(rss.JSON[i]); 
      } 

      $('#' + id + ' li ').each(function() { 
       var delay = ($(this).index()/rss.storiesLimit) + 's'; 
       $(this).css({ 
        webkitAnimationDelay: delay, 
        mozAnimationDelay: delay, 
        animationDelay: delay 
       }); 
      }); 

     } 
    } 
}); 

} 

$.when(RSSWidget('rss1', "http://rss.cnn.com/rss/money_markets.rss")) 
.then(function() { 
    RSSWidget('rss2', "http://feeds.reuters.com/reuters/financialsNews") 
}) 
.then(function() { 
    RSSWidget('rss3', "http://finance.yahoo.com/rss/topfinstories") 
}); 

答えて

1
.then(RSSWidget('rss2', "http://feeds.reuters.com/reuters/financialsNews")); 

がすぐに起動されます。また

.then(function() { 
    RSSWidget('rss2', "http://feeds.reuters.com/reuters/financialsNews") 
}) 

RSSWidget.then()内の無名関数を呼び出して試してみてください、何の約束はRSSWidgetから返されません。 RSSWidgetreturn $.ajax(/* settings */)を含めて、RSSWidgetからjQuery約束オブジェクトを返すことができます。

+0

試してみました。無運 –

+1

@AdityaVikasDevarapalliあなたは 'RSSWidget'から約束を返せません。 'RSSWidget'の中に' return $ .ajax(/ * settings * /) 'を含めてみてください – guest271314

+0

ええ、...うまくいきました...ありがとうございます...私の間違いを詳しく教えてください。 –

関連する問題