jquery - 动态获取值，即 scrollTop() 并存储在数组中

Question

我正在尝试获取动态值，即 scrollTop() 和 text() - 将它们存储在一个数组中，然后稍后在滚动事件中使用它们。到目前为止，我有这个，这似乎只是在推动第一个值。我确信还有其他一些超级有效的方法可以使用更少的代码来做到这一点，但我对此很陌生，我只是想了解它为什么不起作用。任何帮助将不胜感激！萨米。

var $titleName = [];
var $titlePosition = [];

$('#section-title').each(function () {
    $titleName.push($(this).text());
});

$('#section-title').each(function () {
    $titlePosition.push($(this).offset());
});

$(window).scroll(function () {
    windowScroll = $(this).scrollTop();

    if (windowScroll >= $titlePosition[0].top) {
        $tooltip.text($titleName[0]);
    }

    if (windowScroll >= $titlePosition[1].top - 100) {
        $tooltip.text($titleName[1]);
    }

    if (windowScroll >= $titlePosition[2].top - 100) {
        $tooltip.text($titleName[2]);
    }

    if (windowScroll >= $titlePosition[3].top - 100) {
        $tooltip.text($titleName[3]);
    }
});

http://jsfiddle.net/userdude/sTNJM/

Answer 1

更改.section-title为类，因为 ID 是唯一的，$.map用于数组，并且每个都用于迭代并执行 if 条件：

var elem           = $('.section-title'),
    $titleName     = $.map(elem, function(el,i) { return $(el).text(); }),
    $titlePosition = $.map(elem, function(el,i) { return $(el).offset().top; });

$(window).on('scroll',function() {
    var windowScroll = $(this).scrollTop();

    $.each($titlePosition, function(i, pos) {
        var pad = i>0 ? 100 : 0;
        if ( windowScroll >= (pos - pad) ) $tooltip.text($titleName[i]);   
    });
});