如何循环遍历每个项目并为每个实例返回相应的值（jquery 和 scrollmagic）答案

【问题标题】：How to loop through each item and return the corresponding value for each instance (jquery and scrollmagic)如何循环遍历每个项目并为每个实例返回相应的值（jquery 和 scrollmagic）
【发布时间】：2019-12-11 22:02:49
【问题描述】：

当 div (.overNav) 进入触发区域时，我正在使用滚动魔法（很棒）来触发事件。我有多个 .overNav div，所以我使用 .each() 循环来触发每个实例。这可行，但我还需要找到每个 div 的高度并告诉滚动魔法更新每个 unique 实例的 unique 持续时间。这一半有效...

下面的脚本返回每个 .overNav div 的高度，但它返回每个实例的所有 overNav div 高度。 我不确定如何指定第一个 .overNav div 使用第一个 overNav div 高度，第二个使用第二个，依此类推。 我的 console.log ' m 使用为 each 实例吐出 both 高度。该脚本仅使用 last overNav 高度更新持续时间，而不是正确的高度。

所以我在每个循环中，并且期望该循环中的每个函数都会返回该特定实例的信息。我究竟做错了什么？我相当未经训练，基本上是通过这些事情来搞砸我的方式。这个让我难住了。

jQuery(document).ready(function ($) {   
//Init ScrollMagic
var controller = new ScrollMagic.Controller(); 
//Scene 3 Loop - send .underNav objects under the sidenav
    $('.overNav').each(function() {
        // build a scene
        var overNavScene = new ScrollMagic.Scene({
            triggerHook: '.25',
            reverse: true,
            triggerElement: this
        })
        .setClassToggle("#sidenav", "fade-out")
        //get height of each overnav on enter
        .on("enter", function() {
            $('.overNav').each(function() {
                var overNavHeight = $(this).height()   
                overNavScene.duration(overNavHeight);
                console.log(overNavHeight);
             });
        }) 
        .addTo(controller);
    });   
});

【问题讨论】：

标签： jquery loops each scrollmagic

【解决方案1】：

如果这对其他人有用，我想我想通了。我需要将“this”进一步传递给嵌套函数，所以我在一个变量中声明它并删除了下游的附加每个循环。

jQuery(document).ready(function ($) {   
//Init ScrollMagic
var controller = new ScrollMagic.Controller(); 
//Scene 3 Loop - send .underNav objects under the sidenav
    var $thisss = this; // THIS was the key
    $('.overNav').each(function() {
        // build a scene
        var overNavScene = new ScrollMagic.Scene({
            triggerHook: '.25',
            reverse: true,
            triggerElement: $thisss
        })
        .setClassToggle("#sidenav", "fade-out")
        //get height of each overnav on enter
        .on("enter", function() {
            $('.overNav').each(function() {
                var overNavHeight = $($thisss).height()   
                overNavScene.duration(overNavHeight);
                console.log(overNavHeight);
             });
        }) 
        .addTo(controller);
    });   
});

【讨论】：