Javascript：如何停止點擊事件排隊？

下面的代碼可以正常工作，唯一的問題是click事件被排隊，比如setTimeout被每次點擊所調用，彈出窗口會多次出現。如何使彈出只出現當用戶點擊並確保每個彈出之間的差距可以說4秒Javascript：如何停止點擊事件排隊？

var showpopup = 1; 
var check = true; 
var seconds = 4000;    // change the frequency here current frequency = 2 seconds 
var url = "https://www.fb.com"; // change the url here 
var strWindowFeatures = "toolbar=yes,scrollbars=yes,resizable=yes,top=0,left=0,width=" +screen.width 
         + ",height=" +screen.height; 
function popup (event) 
{ 
    event.stopPropagation(); 
    if (showpopup === 1) 
    { 
      //if 
(navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Windows 
Phone|Opera Mini|IEMobile/i)) 
      //{ 
       if (check == true) 
       { 
         window.open(url , '_blank' , strWindowFeatures); 
         showpopup++; 
         check = false; 
       } 
      //} 
    } 
    else 
    { 
     setTimeout(checkValue, seconds); 
    } 
} 

function checkValue() 
{ 
    showpopup = 1; 
    check = true; 
} 

window.onclick = popup(event);

來源

2017-05-31 Alien128

我本來認爲'window.onclick =彈出（事件）;'不設置點擊處理程序，因爲你正在設置（用一個空的事件參數調用彈出窗口）的返回值來處理點擊，而不是設置函數本身，如'window.onclick = popup;' – James

對不起，這是我的錯誤張貼舊版本沒有檢查 – Alien128

這就是所謂的功能節流：

function throttle(func){ 
    var timeout=null; 
    return function(...args){ 
    if(!timeout) func(...args), timeout=setTimeout(_=>timeout=null,4000);//if were not waiting, execute the function and start waiting 
    } 
}

所以，你可以做

var alert=throttle(window.alert); 

alert("Wohoo!"); 
alert("Never executed!");

你的情況，那就是：

window.onclick = throttle(popup);

我的語法是也許有點複雜（ES6），所以讓我們解釋一下：

return function(...args){

回報存儲在args數組的所有參數（這樣我們就可以通過一項新功能它給我們的內部函數）

if(!timeout)

如果世界上沒有超時

func(...args),

呼叫的功能，通過我們的args數組作爲參數（稱爲傳播算子）

timeout=setTimeout(...,4000)

設置我們的超時4000之後執行以執行以下操作：

_=>timeout=null

當超時結束，重置超時並等待下一個函數調用...

來源

2017-05-31 16:23:42

謝謝@ Jonas-w的幫助工作像一個魅力 – Alien128

有什麼辦法可以停止排隊點擊事件，而不使用這個油門功能 – Alien128

@ Alien128是的舒爾。不過，你可以應用那裏使用的原則。但是，通過這個，你的代碼是真正可讀的 –

Lodash對此有一個throttle函數。

_.throttle(func, [wait=0], [options={}])

來源

2017-05-31 16:29:31 hackio

[wait = 0]可能是不好的語法，並且只爲一個函數嵌入整個框架並不需要 –

@Jonasw [wait = 0]表示默認值是0. Lodash有很多的功能，使事情變得更容易，所以這是一個選擇... – hackio

@ hackio你能否詳細說明 – Alien128

下面的代碼解決了該問題，而無需使用油門

// JavaScript的文檔

var showpopup = 1; 
var check = true; 
var seconds = 4000;    // change the frequency here current frequency = 2 seconds 
var url = "https://www.fb.com"; // change the url here 
var strWindowFeatures = "toolbar=yes,scrollbars=yes,resizable=yes,top=0,left=0,width=" +screen.width + ",height=" +screen.height; 

function popup() 
{ 
    if (check === false) 
    { 
     return; 
    } 
    else if (showpopup === 1) 
    { 
     if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Windows Phone|Opera Mini|IEMobile/i)) 
     { 
       if (check == true) 
       { 
        window.open(url , '_blank' , strWindowFeatures); 
        showpopup++; 
        check = false; 
        setTimeout(checkValue , seconds); 
       } 
     } 
    } 
} 

function checkValue() 
{ 
    showpopup = 1; 
    check = true; 
} 

window.onclick = popup;

來源

2017-05-31 17:41:12 Alien128

Javascript：如何停止點擊事件排隊？

回答

相關問題