我有两个事件:一个是onclick
,当我点击菜单时滚动到某个div而另一个事件在onscroll
中,当滚动接近时突出显示“菜单项” div。
我的问题是:当另一个执行时,我怎么能“禁止”执行一个envent。
这是我的代码:
function goToByScroll(id){
var value = $(id).offset().top;
var scrl = value - 154;
$('html,body').animate({
scrollTop: scrl},
'slow');
}
//scroll menu control
$("#menu-home ul li a").click(function(e) {
e.preventDefault();
$("#menu-home ul li a").removeClass('menu-home-active');
$(this).addClass('menu-home-active');
goToByScroll($(this).attr("href"));
});
//scroll bar control
$(window).scroll(function() {
var scrv = $(this).scrollTop();
var allmenu = $("#menu-home ul li a");
if(scrv == 0){
allmenu.removeClass('menu-home-active');
$('#menu-div1').addClass('menu-home-active');
}
if(scrv > 458 && scrv < 478){
allmenu.removeClass('menu-home-active');
$('#menu-div2').addClass('menu-home-active');
}
if(scrv > 989 && scrv < 1009){
allmenu.removeClass('menu-home-active');
$('#menu-div3').addClass('menu-home-active');
}
if(scrv >= 1324){
allmenu.removeClass('menu-home-active');
$('#menu-div4').addClass('menu-home-active');
}
});
由于
答案 0 :(得分:3)
第一个;当滚动事件(或相反)时,click事件不会触发。当您进入滚动事件时,click-event已经完成。
您应该做的是在click事件上设置一个变量,如下所示:
function goToByScroll(id) {
window.isAutoScrolling = true;
var value = $(id).offset().top;
var scrl = value - 154;
$('html,body').animate({scrollTop: scrl}, 'slow', goToByScrollCompleted);
}
function goToByScrollCompleted() {
window.isAutoScrolling = false;
}
然后你添加滚动事件的开头:
if(window.isAutoScrolling) return;
此外,至于注册goToByScrollCompleted,这可能会以多种方式完成,但是,因为我不知道你如何进行滚动我不能说。
答案 1 :(得分:1)
你可以拥有全局布尔变量lock
,检查它是否为false,如果是,则将其设置为true并执行你的函数。然后重置它。