在传递节时触发一个函数 - jquery

Fire a function when passing a section - jquery

本文关键字：一个 函数 jquery      更新时间：2023-09-26

我正在努力让我的代码的最后一点工作。问题是当用户滚动到div时，我需要触发一个函数

所以我的html的结构大致是这样的

<div class="panel-grid-cell">
  <div id="pgc-1">...</div>
  <div id="pgc-2">...</div>
  ...
  <div id="pgc-n">...</div>
</div>

所以这个想法是当用户传递一个div时id="pgc-1"触发一个函数，依此类推。

这些div中的每一个都有一个附加了href的li a项目，所以我的函数看起来像这样 

ga('send','event','scroll',city,$(this).text())

其中this将与href li a对应

目前我所拥有的就是这个。一个循环遍历div并将其id's存储在数组中的函数。并构建li a菜单。

 var li="";
 var linames = ["Intro","1925","1935","1945","1955","1965","1975","1985","1995","2005","Now"];
 var i = 0;
 function getSectionIDs()
 {
    $("div.panel-grid-cell").children().each(function() {
    if(linames[i] !== undefined)
    {
        li += "<li><a href='#"+$(this).attr('id')+"'>"+linames[i]+"</a></li>";           
    }
    i++;
    });
 $("ul.timeline-items").append(li);
 }

现在我还有一个函数，可以检查我为每个li项目滚动和更改类的距离。

function onScroll(event){
  var scrollPos = $(document).scrollTop();
  $('ul.timeline-items li a').each(function () {
      var currLink = $(this);
      var refElement = $(currLink.attr("href"));
      if (refElement.position().top -75 <= scrollPos && refElement.position().top+75 + refElement.height()-75 > scrollPos) {
         $('ul.timeline-items li a').removeClass("active");
         currLink.addClass("active");
      }
      else{
         currLink.removeClass("active");
      }
    });
    }
    $(document).on("scroll", onScroll);

这段代码不是我想要的，因为它会不断检查我是否通过了div，但我只需要触发一次我的函数。

有什么帮助吗？

前几天自己找到了解决方案，

在

滚动函数中，只需在$(document).scrollTop()等于refElement.offset()时放置一个条件，触发一个函数，它就可以完美运行。

这意味着检查用户滚动了多远，如果此值等于div 的偏移量，则触发一个函数。

相关文章：