Javascript 在jQuery返回未定义的数组中循环

我试图循环一个数组并按顺序返回数据，但我似乎无法返回数据，我收到了

未定义的

我的阵列

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');
            });
        }
    });
})();

var-people=[{
id:0，
姓名：“布莱恩·尼科尔”
}, {
id:1，
姓名：'Gordon Sales'
}, {
id:2，
姓名：“Lorman E.Correa”
}, {
id:3，
姓名：“马克·摩尔”
}, {
id:4，
姓名：“理查德·佩斯利”
}, {
id:5，
名称：“S.Sivalingham”
}, {
id:6，
姓名：“托尼·科尔曼”
}];
var计数器=0；
（函数nextFade（）{
计数器++；
var数字=$（''）；
var信息='Meet'+people.name+''；
figure.html（信息）.appendTo（'.interactivebanner faces'）.hide（）.fadeIn（100，函数（）{
如果（计数器<7）{
nextFade（）；
}否则{
$（“.interactive banner faces”）.children（“：第n个孩子（12n+1），：第n个孩子（12n+2），：第n个孩子（12n+3）”）.addClass（'rightTxt'）；
$（'.interactivebanner'）。on（'mouseenter'，function（）{
$（'.textbox'）.css（'z-index'，'9999'））
$（'.overlay'）.stop（）.animate({
“顶部”：“-450px”
}，200，“easeincrc”）；
}).on（'mouseleave'，函数（）{
$（'.textbox'）.css（'z-index'，'-1'））
$（'.overlay'）.stop（）.animate({
“顶部”：“0”
}，600，“easeOutCirc”）；
});
}
});
})();

你忘了把索引

人[柜台].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');
                });

            }
        });
    })();

（函数nextFade（）{
计数器++；
var数字=$（''）；
变量信息='Meet'+人员[计数器]。名称+''；
figure.html（信息）.appendTo（'.interactivebanner faces'）.hide（）.fadeIn（100，函数（）{
如果（计数器<7）{
nextFade（）；
}否则{
$（“.interactive banner faces”）.children（“：第n个孩子（12n+1），：第n个孩子（12n+2），：第n个孩子（12n+3）”）.addClass（'rightTxt'）；
$（'.interactivebanner'）。on（'mouseenter'，function（）{
$（'.textbox'）.css（'z-index'，'9999'））
$（'.overlay'）.stop（）.animate({
“顶部”：“-450px”
}，200，“easeincrc”）；
}).on（'mouseleave'，函数（）{
$（'.textbox'）.css（'z-index'，'-1'））
$（'.overlay'）.stop（）.animate({
“顶部”：“0”
}，600，“easeOutCirc”）；
});
}
});
})();

您使用的是

人物。姓名

未定义，因为

人物

是一个

数组

---

使用

people[i].name

每个人都有自己的对象。即

console.log（人员[0].name）将为您提供Brian NicolPeople[counter-1]。名称，您可能希望使用计数器作为您的indice@Liam这将是people[counter-1]。代码中的名称请参见fiddle As counter在返回people之前递增counter++；您需要使用人员[counter-1].name。或者为了可读性，您可以移动计数器++；要在var信息之后返回=。。
(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');
                });

            }
        });
    })();