代码之家  ›  专栏  ›  技术社区  ›  mdomino

如何防止在调整大小期间触发onscroll函数?

  •  4
  • mdomino  · 技术社区  · 7 年前

    window.onresize = repositionElements;

    scrollElement.onscroll = handleScrollBusiness;

    现在,当我调整窗口大小时,我会 希望启动onscroll事件(通常在调整大小时会这样做)。所以我想我暂时设置了一些 isResizing true 只需将其设置回 false 为false,然后才继续。

    然而,现在在测试过程中,我意识到当我开始调整窗口大小时,它会触发一个滚动和调整大小事件,但它会触发 onscroll 事件 onresize 没有机会禁用滚动功能,因为它只有在滚动功能开始执行后才会触发。

    有什么办法吗?我可以全局更改这两个事件的顺序吗?如果没有,还有什么其他方法可以在我开始调整大小时立即禁用onscroll事件?

    非常感谢。

    2 回复  |  直到 7 年前
        1
  •  3
  •   mdziekon    7 年前

    由于您尚未发布问题的示例代码,我不确定我将要编写的内容是否对您有帮助。


    你可以试着推迟执行 onscroll

    举个例子:

    window.onscroll = function () {
        setTimeout(function () {
            // your code here...
        }, 0);
    }
    
    window.onresize = function () {
        // your code here...
        // should be executed before onscroll handler
    }
    
        2
  •  1
  •   asmmahmud    7 年前

    RxJs Observable 为此:

    var resizeOb$ = Rx.Observable.fromEvent(window, 'resize');
    var scrolOb$ = Rx.Observable.fromEvent(window, 'scroll')
                  .takeUntil(resizeOb$);
    scrolOb$.subscribe(function(event){
    
         /* handle scroll event here */
    });
    resizeOb$.subscribe(function(event){
    
         /* handle resize event here */
    });
    

    这将有效地为您处理这种情况。