ajax提交 使用css 控制按鈕防止重複點擊

有時候遇到ajax提交數據時 多點幾回會出現重複點擊的狀況.因此下面介紹一個用css控制防重複點擊的效果

submitting 是一個類 沒有任何意思,也能夠寫成變灰度的效果.

原理很簡單

1.判斷有沒有這個類,有說明重複點擊 返回false  if(obj.hasClass('submitting'))return false;

2.添加類 obj.addClass('submitting');

3.若是有表單驗證 須要報錯時移除這個類,以便不影響二次點擊 obj.removeClass('submitting');

4.回調完成移除類 obj.removeClass('submitting');

<script>
var obj=$(".content");
if(obj.hasClass('submitting'))return false;
obj.addClass('submitting');

var query = new Object;
query.id = 1;
$.ajax({
    url:AJAX_URL,
    data:query,
    type:"get",
    success:function(data){
        obj.removeClass('submitting');
        if(data.status==1) {
            
        }else {
            
        }
    }
})
</script>