Почему JavaScript-массив возвращается "Undefined"?

Question

Я создавал приложение в jQuery и html 5, которое читает RSS-ленту блога. Я хотел показать список названий rss, и когда пользователь нажимает на заголовок, он переходит на другую страницу, на которой отображается полный контент. Я могу получить контент с помощью ajax и сохранить их в массиве. Но когда я нажимаю на заголовок, на следующей странице он отображается неопределенно. Я использую страницы jQuery.

$(document).ready(function() { 
    load_posts(); 
}); 

function load_posts() { 
    var PAGINATION = $('#pagination'); 
    var HTML1 = '<li><a href="#post" data-transition="slide" id ="'; 
    var HTML5 = '"><h4>'; 
    var HTML2 = '</h4>'; 
    var HTML3 = '<p>'; 
    var HTML4 = '</p></a></li>'; 
    var btn = ""; 
    var selector = ""; 
    var i = 0; 
    var title = ""; 
    var pubDate = ""; 
    var dascription = ""; 
    var anchorID = ""; 
    var url = ""; 
    var fullPost = new Array; 
    var link = new Array; 
    $.ajax({ 
    type: 'GET', 
    url: 'http://smushbits.com/feed/', 
    dataType: 'xml', 
    error: function() { 
     alert("An error occured!"); 
    }, 
    success: function(xml) { 
     $(xml).find('item').each(function() { 
     title = $(this).find('title').text(); 
     pubDate = $(this).find('pubDate').text(); 
     pubDate = pubDate.substring(5, 16); 
     description = $(this).find('encoded').text(); 
     url = $(this).find('link').text(); 
     fullPost.push(description); 
     link.push(url); 
     anchorID = "btn" + i.toString(); 
     $(HTML1 + anchorID + HTML5 + title + HTML2 + HTML3 + pubDate + HTML4).appendTo(PAGINATION); 
     i = i + 1; 
     }); 

     for (var j = 0; j < fullPost.length; j++) { 
     btn = "#btn" + j.toString(); 
     selector = $(btn); 
     $(document).on("click", selector, function() { 
      document.getElementById('entry').innerHTML = fullPost[j]; 
     }); 
     } 
     PAGINATION.listview("refresh"); 
    } 
    }); 
} 

Answer 1

Это печально известная проблема с циклом.

for (var j = 0; j < fullPost.length; j++) { 
    (function(j) { 
     var btn = "#btn" + j; 
     $(document).on("click", btn, function() { 
      document.getElementById('entry').innerHTML = fullPost[j]; 
     }); 
    }(j)); 
}