在Json数组中选择特定对象未定义

Question

我已经创建了一个for循环来遍历JSON数据并选择特定对象，然后将该对象附加到我的HTML中。当我选择前两个数组时，它完美地工作。但是一旦我选择了第2，第3，第4等，它就说“无法读取未定义的属性'标题”。但前两个对象完美无缺。

我不知道会发生什么。

任何帮助将不胜感激。我已经突出了我认为问题区域的评论和****问题区****

CODE

var newsData;

var eventsData;

function getposts(str) {
    
    var baseUrl = 'http://www.capetownetc.com/api/get_category_posts/?slug=';
    
    $.ajax({
        type: 'GET'
        , url: baseUrl + str
        , data: {
            get_param: 'value'
        }
        , dataType: 'json'
        , success: function postData(data) {
            
            if (str == 'news') {
                newsData = data;
                displayPosts(newsData);
            }
            if (str == 'events') {
                eventsData = data;
            }
            
        }
        
    });

}

getposts('news');
getposts('events');

function displayPosts(str) {
    
    var data = str;
    
    if (str == 'news') {
        data = newsData;
    }
    
    if (str == 'events') {
        data = eventsData;
    }

    //Image Post1
    var imgTitle1 = data.posts[0].title;
    imgTitle1 = imgTitle1.replace("Newsflash:", "");
    $('.ip1.text-heading').html(imgTitle1);
    var imgThumb1 = data.posts[0].thumbnail_images.full.url;
    $('.ip1.main-card-img1').css("background-image", "url(" + imgThumb1 + ")");
//    GET CATEGORY
    var category = data.posts[0].categories[1].title;
    $('.ip1.post-source').html(category + " / ");
    var maxLength2 = 6;
    var pTime = data.posts[0].date;
    pTime = pTime.substr(10, maxLength2);
    $('.ip1.post-source').append(pTime);
    
    
    //Text Post1
    var title1 = data.posts[1].title;
    title1 = title1.replace("Newsflash:", "");
    $('.p1.text-heading').html(title1);
    var ex1 = data.posts[1].excerpt;
    var maxLength = 100;
    ex1 = ex1.substr(0, maxLength);
    $('.p1.text-post-desc').html(ex1);
    var thumb1 = data.posts[1].thumbnail_images.full.url;
    $('.p1.card-img1').css("background-image", "url(" + thumb1 + ")");
//    GET CATEGORY
    var categoryP1 = data.posts[1].categories[1].title;
    $('.p1.post-source').html(categoryP1 + " / ");
    var pTimeP1 = data.posts[1].date;
    pTimeP1 = pTimeP1.substr(10, maxLength2);
    $('.p1.post-source').append(pTimeP1);
    
    //Text Post2
    var title2 = data.posts[2].title;
    title2 = title2.replace("Newsflash:", "");
    $('.p2.text-heading').html(title2);
    var ex2 = data.posts[2].excerpt;
    ex2 = ex2.substr(0, maxLength);
    $('.p2.text-post-desc').html(ex2);
    var thumb2 = data.posts[2].thumbnail_images.full.url;
    $('.p2.card-img2').css("background-image", "url(" + thumb2 + ")");
//    GET CATEGORY
    var categoryP2 = data.posts[2].categories[1].title;
    $('.p2.post-source').html(categoryP2 + " / ");
    var pTimeP2 = data.posts[2].date;
    pTimeP2 = pTimeP2.substr(10, maxLength2);
    $('.p2.post-source').append(pTimeP2);    
    
    
    //Text Post3
    var title3 = data.posts[3].title;
    title3 = title3.replace("Newsflash:", "");
    $('.p3.text-heading').html(title3);
    var ex3 = data.posts[3].excerpt;
    ex3 = ex3.substr(0, maxLength);
    $('.p3.text-post-desc').html(ex3);
    var thumb3 = data.posts[3].thumbnail_images.full.url;
    $('.p3.card-img3').css("background-image", "url(" + thumb3 + ")");
//    GET CATEGORY
    var categoryP3 = data.posts[3].categories[1].title;
    $('.p3.post-source').html(categoryP3 + " / ");
    var pTimeP3 = data.posts[3].date;
    pTimeP3 = pTimeP3.substr(10, maxLength2);
    $('.p3.post-source').append(pTimeP3); 
    
    //POST POPULATE

    $('#post1').click(function post1(str) {
        
        $('.post1').css('left', '0px');
        $('.post-header').css('left', '0px');
        $('.post-cont').css('left', '-9999px');
        $('.slider').css('left', '-9999px');
        
        //Image Post1
        var imgTitle1 = data.posts[0].title;
        imgTitle1 = imgTitle1.replace("Newsflash:", "");
        $('.post1.header').html(imgTitle1);
        
        var imgThumb1 = data.posts[0].thumbnail_images.full.url;
        $('#para-img').css("background-image", "url(" + imgThumb1 + ")");
        
        var text1 = data.posts[0].content;
        $('.post1.text').html(text1);
        
        var category = data.posts[0].categories[1].title;
        $('.lay2.post-source').html(category + " / ");
        var maxLength2 = 6;
        var pTime = data.posts[0].date;
        pTime = pTime.substr(10, maxLength2);
        $('.lay2.post-source').append(pTime);
        
        //GET TAGS *****PROBLEM AREA*****
        function getTags(){
            for (var i = 0; i < data.posts.length; i++) {
            var newTag = "<li>" + "<input type='checkbox' value=' ' class='tag'>" + "<label for='tag' class='post inter-label" + "'>" + data.posts[0].tags[i].title + "</label>" + "</li>";
            $('.tag-list').append(newTag);
            console.log(data.posts[0].tags[i].title);
            console.log(data.posts[2].tags[i].title);
        }}
        getTags();
    });

<div class="slider interest-slider">
                    <div>
                        <p onclick="displayPosts('news')" id="news">Home</p>
                    </div>
                    <div>
                        <p onclick="displayPosts('events')" id="events">Events</p>
                    </div>
                    <div>
                        <p id="health">Nightlife</p>
                    </div>
                    <div>
                        <p>Dine</p>
                    </div>
                    <div>
                        <p>Outdoors</p>
                    </div>
                    <div>
                        <p>Video</p>
                    </div>
                </div>