调整页面大小时，我的功能不止一次运行

Question

在调整页面大小时，我需要在页面中工作一次

decor(some_function)

https://jsfiddle.net/vcode/yh1m2vre/

Answer 1

每次调用函数时都需要取消绑定click事件，你可以这样做：

function example(){
    $('button').off().on("click", function(){
        alert();
    });
}

这样可以防止事件触发重复。

另一种解决方案是将click事件绑定到函数外部，然后只触发click操作。你可以这样做：

$('button').on("click", function(){
    alert();
});

function example(){
    $('button').trigger('click');
}

Answer 2

正如其他人在评论中解释的那样，问题是因为每次click()事件发生时您都会绑定多个新的resize事件处理程序。

要解决此问题，最好反转逻辑，以便只在单击处理程序中检查屏幕的宽度，然后采取相应的行动。

$('button').click(function(){
  if ($(window).width() >= 768)
    return;

  console.log('window size < 768');
});

以这种方式组织逻辑意味着您只有一个事件处理程序用于页面的生命周期，而不是可能添加/删除新的数百次（如果不是数千次）。

Answer 3

添加事件监听器：

    function callbackFunc() {
        callAnOtherFunction();
    }

    // listen for events
    window.addEventListener("resize", callbackFunc);