开发者社区> 问答> 正文

jquery ajax 如何避免重复提交

之前的做法 就是把按钮给禁用掉,
突然 想起文本框里敲回车 还是会提交表单。
现在打算用一变量来标记是否已经点击了提交。
我想知道的是 还有没别的 更优雅的方法?

展开
收起
a123456678 2016-07-29 10:42:45 2120 0
1 条回答
写回答
取消 提交回答
  • 用一个变量加锁
    
    var lock = false;
    执行Ajax的事件起初处判断
    
    if (lock) {return;}
    在Ajax发送前
    
    lock = true;
    在Ajax返回或错误后的回调函数中
    
    lock = false;
    如果你觉得无效化按钮挺优雅的话,那可以把整个表单都无效化加上 disabled ,就不担心回车的问题了,嫌麻烦还有简单的。 写一个loading
    
    .loading {
      position: absolute;
      z-index: 10000;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      background: url(...) center center;
    }
    然后像上面的变量一样的,加锁时放入这个loading的标签,比如
    
    $('form').append($('div').addClass('loading'));
    回调后解锁时删除它
    
    $('form').find('.loadding').detach();
    2019-07-17 20:01:39
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载