Ajax 重复提交问题处理方案
注:ajax重复提交原因,是ajax是异步的,在网络延迟或者服务器卡顿时候,多次点击提交按钮会重复提交。
一、方案1,简单方式处理ajax重复提交,使用变量控制
1.js代码
//标记是否提交
var isSubmit=false;
$('#Submit').click(function(){
if(isSubmit)return false;
var name=$('#Name').val();
var mobile=$('#Mobile').val();
isSubmit=true;
$.post('/home/add',{name:name,
mobile:mobile
},res=>{
isSubmit=false;
console.info(res);
});
return false;
});
2.html代码
<form>
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label">姓名</label>
<input type="text" class="form-control" id="Name" aria-describedby="emailHelp">
<div id="emailHelp" class="form-text">We'll never share your email with anyone else.</div>
</div>
<div class="mb-3">
<label for="exampleInputPassword1" class="form-label">电话</label>
<input type="text" class="form-control" id="Mobile">
</div>
<button type="submit" id="Submit" class="btn btn-primary">提交</button>
</form>
3.后台代码
LogStandard.LogHelper _log = new LogStandard.LogHelper();
public IActionResult Add(string name, string mobile)
{
try
{
Thread.Sleep(1000);
_log.WriteLine($"姓名:{name},电话:{mobile}");
return Content("保存成功");
}
catch (Exception ex)
{
return Content(ex.Message);
}
}
二、
更多方案待完善。。。
更多: