循环遍历数组,jQuery返回undefined

时间:2013-11-27 11:10:25

标签: javascript jquery arrays

我试图遍历一个数组并返回数据,只是我似乎无法返回数据,我收到undefined

http://jsfiddle.net/Liamatvenn/UvNw3/2/

我的数组

var people = [{
    id: 0,
    name: 'Brian Nicoll'
}, {
    id: 1,
    name: 'Gordon Sales'
}, {
    id: 2,
    name: 'Lorman E. Correa'
}, {
    id: 3,
    name: 'Mark Moor'
}, {
    id: 4,
    name: 'Richard Paisley'
}, {
    id: 5,
    name: 'S. Sivalingham'
}, {
    id: 6,
    name: 'Tony Coleman'
}];

var counter = 0;

(function nextFade() {
    counter++;
    var figure = $('<figure style="float:left; width:130px; height:30px;" />');
    var information = '<figcaption><h6>Meet ' + people.name + '</h6></figcaption>';
    figure.html(information).appendTo('.interactive-banner-faces').hide().fadeIn(100, function () {
        if (counter < 7) {
            nextFade();
        } else {
            $('.interactive-banner-faces').children(':nth-child(12n+1), :nth-child(12n+2), :nth-child(12n+3)').addClass('rightTxt');

            $('.interactive-banner').on('mouseenter', function () {
                $('.textbox').css('z-index', '9999')
                $('.overlay').stop().animate({
                    'top': '-450px'
                }, 200, 'easeInCirc');
            }).on('mouseleave', function () {
                $('.textbox').css('z-index', '-1')
                $('.overlay').stop().animate({
                    'top': '0'
                }, 600, 'easeOutCirc');
            });
        }
    });
})();

2 个答案:

答案 0 :(得分:3)

您忘记了索引people[counter].name

(function nextFade() {

        counter++;
        var figure = $('<figure style="float:left; width:130px; height:30px;" />');
        var information = '<figcaption><h6>Meet ' + people[counter].name + '</h6></figcaption>';
        figure.html(information).appendTo('.interactive-banner-faces').hide().fadeIn(100, function () {
            if (counter < 7) {
                nextFade();
            } else {

                $('.interactive-banner-faces').children(':nth-child(12n+1), :nth-child(12n+2), :nth-child(12n+3)').addClass('rightTxt');

                $('.interactive-banner').on('mouseenter', function () {


    $('.textbox').css('z-index', '9999')

                    $('.overlay').stop().animate({
                        'top': '-450px'
                    }, 200, 'easeInCirc');
                }).on('mouseleave', function () {

                     $('.textbox').css('z-index', '-1')

                    $('.overlay').stop().animate({
                        'top': '0'
                    }, 600, 'easeOutCirc');
                });

            }
        });
    })();

答案 1 :(得分:3)

您使用未定义的people.name,因为peopleArray 使用people[i].name