결과가이 함수로 표시되지 않음

Question

나는 RSS 피드 데이터를 가져 오기 위해 다음 함수를 작성했습니다.

스크립트 끝의 두 경고가 모두 표시되기 때문에 결과는 jQuery::append()을 통해 div에 추가되지 않으므로 흥미 롭습니다. 함수를 추가하기 위해 전달 된 ID가 완전히 정확하다고 언급해야합니다. 아약스는 비동기이기 때문에

function generateTopNews() { 
     // Manage RSS url 
     var targetsURLs = new Array("http://www.jamejamonline.ir/rssfeed?code=01-10-95", "http://www.khorasannews.com/RSS.aspx?type=1", "http://www.tabnak.ir/fa/rss/1", "http://www.varzesh3.com/rss/"); 
     var logoURLs = new Array("images/jm_logo.png", "images/kh_logo.png", "images/tb_logo.png", "images/v3_logo.png"); 
     // Temp variables 
     var resultArray = new Array(); 
     var rssCounter = 0; 
     // RSS Loader 
     for (var i = 0; i < targetsURLs.length; i++) { 
      $.ajax({ 
       url: "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=" + encodeURIComponent(targetsURLs[i]), 
       dataType: "json", 
       success: function(data) { 
        var fetchedFeed = data.responseData.feed.entries; 
        for (var j = 0; j < fetchedFeed.length && j < 2; j++) { 
          // RSS HTML Template 
          var htmlContent = "<div class=\"col-md-4 col-sm-6\">"; 
          htmlContent += " <div class=\"panel panel-default\">"; 
          htmlContent += "  <div class=\"panel-heading\">"; 
          htmlContent += "   <img class=\"pull-left\" src=\"" + logoURLs[i] + "\" height=\"23px\" />";  
          htmlContent += "   <p>" + fetchedFeed[j].title + "<p>";  
          htmlContent += "  </div>"; 
          htmlContent += "  <div class=\"panel-body\">";      
          htmlContent +=    fetchedFeed[j].contentSnippet; 
          htmlContent += "  </div>"; 
          htmlContent += " </div>"; 
          htmlContent += "</div>"; 
          // Count up the RSS 
          resultArray[rssCounter++] = htmlContent; 
        } 
       } 
      }); 
     } 
     // Start 
     $("#rss-container").append("@Start"); 
     alert("@Start"); 
     // Append the results 
     for (var i = 0; i < resultArray.length; i++) { 
      $("#rss-container").append(resultArray[i]); 
     } 
     // End 
     $("#rss-container").append("@End"); 
     alert("@End"); 
    } 

Answer 1

는, 당신은 성공 이벤트 내부 append()에 대한 코드를 작성해야합니다. 그렇지 않으면 서버에서 데이터를 가져 오기 전에 append()이 발생합니다.

function generateTopNews() { 
     // Manage RSS url 
     var targetsURLs = new Array("http://www.jamejamonline.ir/rssfeed?code=01-10-95", "http://www.khorasannews.com/RSS.aspx?type=1", "http://www.tabnak.ir/fa/rss/1", "http://www.varzesh3.com/rss/"); 
     var logoURLs = new Array("images/jm_logo.png", "images/kh_logo.png", "images/tb_logo.png", "images/v3_logo.png"); 
     // Temp variables 
     var resultArray = new Array(); 
     var rssCounter = 0; 
     // RSS Loader 
     for (var i = 0; i < targetsURLs.length; i++) { 
      $.ajax({ 
       url: "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=" + encodeURIComponent(targetsURLs[i]), 
       dataType: "json", 
       success: function (data) { 
        var fetchedFeed = data.responseData.feed.entries; 
        for (var j = 0; j < fetchedFeed.length && j < 2; j++) { 
         // RSS HTML Template 
         var htmlContent = "<div class=\"col-md-4 col-sm-6\">"; 
         htmlContent += " <div class=\"panel panel-default\">"; 
         htmlContent += "  <div class=\"panel-heading\">"; 
         htmlContent += "   <img class=\"pull-left\" src=\"" + logoURLs[i] + "\" height=\"23px\" />"; 
         htmlContent += "   <p>" + fetchedFeed[j].title + "<p>"; 
         htmlContent += "  </div>"; 
         htmlContent += "  <div class=\"panel-body\">"; 
         htmlContent += fetchedFeed[j].contentSnippet; 
         htmlContent += "  </div>"; 
         htmlContent += " </div>"; 
         htmlContent += "</div>"; 
         // Count up the RSS 
         $("#rss-container").append(htmlContent); 
        } 
       } 
      }); 
     } 

    }