是否有更好的方法来减少代码重复?
也许以某种方式循环“pagesTop”数组?
以下函数在窗口滚动事件上初始化。
谢谢。
function redrawSideNav() {
var pagesTop = new Array();
$('.page').each(function(index, elem){
pagesTop[index] = $(this);
});
$('.menu, .page').find('a').removeClass('active');
if ( $(document).scrollTop() >= pagesTop[0].offset().top && $(document).scrollTop() < pagesTop[1].offset().top) {
var target = '#' + pagesTop[0].attr('id');
$('[href^="'+target+'"]').addClass('active');
} else if ( $(document).scrollTop() >= pagesTop[1].offset().top && $(document).scrollTop() < pagesTop[2].offset().top) {
var target = '#' + pagesTop[1].attr('id');
$('[href^="'+target+'"]').addClass('active');
} else if ( $(document).scrollTop() >= pagesTop[2].offset().top && $(document).scrollTop() < pagesTop[3].offset().top) {
var target = '#' + pagesTop[2].attr('id');
$('[href^="'+target+'"]').addClass('active');
} else if ( $(document).scrollTop() >= pagesTop[3].offset().top && $(document).scrollTop() < pagesTop[4].offset().top) {
var target = '#' + pagesTop[3].attr('id');
$('[href^="'+target+'"]').addClass('active');
} else if ( $(document).scrollTop() >= pagesTop[4].offset().top) {
var target = '#' + pagesTop[4].attr('id');
$('[href^="'+target+'"]').addClass('active');
}
}
最佳答案
嗯,下面的代码中似乎只有数字发生了变化,因此您可以使用带有break语句的for循环。当break get被触发时,for循环的其余部分将不会被执行。最后一个 else if(...)
是相同的,但没有最后一个条件。我们可以通过向pagesTop 附加一个虚拟元素来伪造这一点,这使得最后一个条件始终为真。
var a = {
offset: function() {
return {'top': 9999999999999};
}
};
pagesTop.push( a );
for( var i = 0; i < pagesTop.length-1; i++ ) {
if ( $(document).scrollTop() >= pagesTop[i].offset().top && $(document).scrollTop() < pagesTop[i+1].offset().top) {
var target = '#' + pagesTop[i].attr('id');
$('[href^="'+target+'"]').addClass('active');
break;
}
}
关于javascript - 减少代码重复,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19479196/