js中多个事件同时发生，如何阻止其中一个事件？

Question

我要实现的就是当滚动轴滚动到指定区域的时候，小序号变成指定的颜色，同时页面滚动到小序号对应的区域，同时点击对应的小序号的时候，也可以滚动到指定区域，同时小序号变成指定的颜色，问题就出现了，仅仅滚动的时候，是没问题，但是当点击对应的序号，跳转到指定区域的时候，click事件与scroll事件是同时发生的，因为点击要跳转到指定位置，同时也会触发滚动事件，这时候小序号的颜色会出现多次渲染

 截图如下

我要问的问题是：当页面停留在1序号的时候，我点击2序号的时候，他会将1序号的背景颜色变色后，才将2的背景颜色变色，产生的视觉效果特别不好，就是先将前面序号渲染后，再跳到指定的序号，有一个弹跳的过程，产生这个现象的原因是因为 if(st>=((this).attr("scrollto")).offset().top)这个条件，因为当点击2序号的时候，肯定会满足1序号的条件，当点击3的时候，页面的scrolltop肯定也会满足1与2，怎样才可以让这种现象不出现啊？