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>

 

转载于:https://my.oschina.net/xiaogg/blog/3060507