我的功能正在運行超過一次，當我調整頁面

-2

<button></button> 

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


$(window).bind('resize load', function(){ 

    if ($(this).width() < 768){ 
    example(); 
    } 
});

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

來源

2017-05-17 vulkan

因爲每次調整大小並且寬度低於768時都要綁定點擊事件。你想要做什麼？ – nikhil

每當您重新調整大小時，都會綁定一個新的點擊事件。所以在你調整一次後，你有一個點擊處理程序。再次調整大小後，您有2個點擊處理程序（它們執行相同的操作）。然後是4，然後是8，然後是16，依此類推。 – David

是的，我注意到了。我不知道我可以如何防止這種情況。 – vulkan

時，您需要在每次調用時解除綁定click事件你的功能，你可以這樣做：

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

這樣可以防止事件觸發重複。

另一種解決方案是將click事件綁定到函數外部，然後觸發點擊操作。你可以這樣來做：

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

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

來源

2017-05-17 14:44:23 Joscplan

正如我想（第一個功能）。謝謝。 – vulkan

添加事件偵聽器：

function callbackFunc() { 
     callAnOtherFunction(); 
    } 

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

來源

2017-05-17 14:46:18 Samuel

正如其他人的評論已經解釋，這個問題是因爲你每次結合多個新click()事件處理resize事件發生。

爲了解決這個問題，最好是將邏輯顛倒一下，以便在一個單擊處理程序中只檢查屏幕寬度，然後採取相應措施。

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

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

有以這種方式組織的邏輯意味着你永遠只能對網頁的壽命一個單一的事件處理程序，而不是潛在的添加/刪除新的數百，甚至數千次。

來源

2017-05-17 14:52:51

@ freedomn-m謝謝！ –

我的功能正在運行超過一次，當我調整頁面

回答

相關問題