jQuery時間間隔點擊限制

我需要解決困擾我們平臺的問題。在產品網站上有這個報告頁面，用戶可以去生成報告。報告可能太大而無法生成，只需幾分鐘。有些用戶不耐煩，並多次點擊生成按鈕。我想知道是否可以在按鈕上設置一個時間，也就是說，當有人點擊生成報告按鈕時，頁面不會讓他們再按5分鐘。更有趣的場景是，將某些內容存儲在cookie中或者某些內容中，即使刷新頁面也不會阻止它們的點擊。jQuery時間間隔點擊限制

如果你能給我一些關於這個問題的好主意或例子，我將不勝感激，因爲我不是jQuery專業人員。

來源

2013-02-28 ComeRun

當然，您可以使用本地存儲設置時間戳，並使用jQuery輕鬆設置禁用的屬性。

要禁用點擊：

$('#myButton').on('click', function() { 
    var $this = $(this); 
    $this.prop('disabled', true); 
    localStorage.myButtonEnableAt = new Date().getTime() + 30000; 

    setTimeout(function(){ 
     $this.prop('disabled', false); 
     localStorage.myButtonEnableAt = null; 
    }, 30000); 
});

在頁面加載，檢查狀態：

var now = new Date().getTime(); 
if (localStorage.myButtonEnableAt > now) { 
    $('#myButton').prop('disabled', true); 
    setTimeout(function(){ 
     $('#myButton').prop('disabled', false); 
     localStorage.myButtonEnableAt = null; 
    }, localStorage.myButtonEnableAt - now); 
}

演示：http://jsfiddle.net/36JrM/ - 改爲10秒禁用，以便更快演示。點擊按鈕。 5秒後，刷新頁面，並在5秒鐘後按預期啓用。

來源

2013-02-28 23:42:34 AlienWebguy

感謝您的好回答的人。 – ComeRun 2013-03-01 00:55:38

高興地幫助:) – AlienWebguy 2013-03-01 00:56:53

對於簡單的情況下，您可以禁用按鈕：

$('input').click(function() { 
    $(this).prop('disabled', true); 
});

雖然一個更好的解決辦法是將顯示進度指示器（或至少是紡車）來告訴用戶該東西是正在完成。你也可以有一個虛假的進度條，緩慢增加7分鐘。

真正的問題是用戶沒有得到任何反饋，所以他們按下按鈕來獲得您的某種反饋。禁用按鈕並且不讓他們重新提交它可能會讓他們感到沮喪，但我敢打賭，給用戶的任何進步都會讓他們開心。

來源

2013-02-28 23:44:59 Blender

對於表單我通常做這樣的事情，所以它處理任何類型的提交，而不僅僅是點擊按鈕。

$('form').bind('submit',function(e){ 
    var $form = $(this); 

    if ($form.data('submitted') === true){ 
     e.preventDefault(); 
    } 
    else { 
     $form.data('submitted', true); 
    } 

    setTimeout(function(){ 
     $form.data('submitted', false); 
    }, 30000); 
});

對於按鈕只有你可以使用.prop('disabled', true)在其他的答案中提到。

來源

2013-02-28 23:48:40 ZolaKt

jQuery時間間隔點擊限制

回答

相關問題