网页滚动时候清楚定时器

关于网页不断弹框，想再表单输入的时候把窗口屏蔽掉，解决思路有以下两种。

思路1：在滚动条滚动到表单高度之下的时候，清楚各种定时器，注意针对setTimeout用clearTimeout，针对setInterval用clearInterval清楚定时器，并且定时器要定义成全局变量。当滚动条滚回表单高度之上的时候，重新弹出窗口。

 

思路2：当在表单上onmousedown或者onmouseover的时候，清楚各种定时器。当点击提交按钮在表单提交完成的时候，重新弹出窗口。弊端是如果表单不提交，那么不会再重新弹出窗口。注意div和form没有onfocus和onblur事件，手机上没有onmouseover和onmouseout事件

 

所以思路1优于思路2

$(function(){

var guahaoAreaDomId='#gdhere';

var checkScrollIsGetInGuahaoArea = function(){

return ($(window).scrollTop()-$(guahaoAreaDomId).offset().top) > 0

}

var lastIsGetInGuahaoArea = checkScrollIsGetInGuahaoArea();

 // 监听滚动事件

$(window).scroll(function(){

// 获得div的高度

var curIsGetInGuahaoArea = checkScrollIsGetInGuahaoArea();

if(lastIsGetInGuahaoArea^curIsGetInGuahaoArea){

lastIsGetInGuahaoArea = curIsGetInGuahaoArea;

alert('打开定时器窗口')         //调用原来的关闭函数

if(curIsGetInGuahaoArea){

alert('清楚定时器');//清空原来关闭函数的所有时间控制器

}

}

});

/*$(window).scroll(function(){

     if($(window).scrollTop() > $(guahaoAreaDomId).offset().top ){

              alert('清楚定时器窗口');

           }else{

              alert('打开定时器窗口');

          }    

})*/

});

注释掉的内容就是，当滚动条滚动的时候就会触发。滚动超过指定高度触发 “清楚定时器函数”，反之触发“打开定时器窗口”，按照

$(window).scroll(function(){

     if($(window).scrollTop() > $(guahaoAreaDomId).offset().top ){

              alert('清楚定时器窗口');

           }else{

              alert('打开定时器窗口');

          }    

})

方法的弊端就是当滚动上下 步数不一致的时候无法控制步数是一样的。比如滚动上去2步，下来1步，那么就算到达了表单，也还是会弹出定时器函数。

所以通过记录滚动高度，来触发是正确的。