200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > jquery防止重复提交表单

jquery防止重复提交表单

时间:2018-09-10 04:52:08

相关推荐

jquery防止重复提交表单

重复触发就是防止用户重复点击提交数据了,我们一般都是点击之后没反应会再次点击了,这个不但要从用户体验上来做好,还在要js或java程序脚本上做好,让用户知道点击是己提交服务器正在处理,下面我就整理从脚本上来处理此重复触发的问题。

很多时候事件会被快速重复触发,比如 click,这样就会执行两次代码,造成很多后果。比如说添加表单时,连续多次点击会出现一下添加多个数据的情况。现在有比较多的解决方法,但几乎都有局限性,比如一个 Ajax 表单,如果防止用户一次点好多下可以在第一次点击的时候冻结提交按钮,直到允许再次点击的时候再放开。很多人都这样干,但在其他的情况就不是很有效了。

下面推荐一个不错的方法,首先丢一个函数进去。

var _timer = {};function delay_till_last(id, fn, wait) {if (_timer[id]) {window.clearTimeout(_timer[id]);delete _timer[id];}return _timer[id] = window.setTimeout(function() {fn();delete _timer[id];}, wait);}

使用方法:

$dom.on('click', function() {delay_till_last('id', function() {//注意 id 是唯一的//响应事件}, 300);});

上面的代码可以让点击之后等待 300 毫秒,如果在 300 毫秒内又发生了这个事件则废除上一次点击,重新计时,反复如此,直到完全等待了 300 毫秒再响应事件。

var _timer = {};function delay_till_last(id, fn, wait) {if (_timer[id]) {window.clearTimeout(_timer[id]);delete _timer[id];}return _timer[id] = window.setTimeout(function() {fn();delete _timer[id];}, wait);}function submitfrm(){delay_till_last('id', function() {//注意 id 是唯一的//响应事件submitform();}, 300);}function submitform(){$('#editfm').form('submit',{method:'post',url:'<%=path%>/BaseCostFieldController/insertBaseCostField.do',success: function(val){var data = eval('('+val+')');$('#editdg').dialog('close');if(data.result){$.messager.alert('消息',data.message);$('#dg').datagrid('reload');}else{$.messager.alert('警告',data.message);}}});}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。