我正在使用 jquery 创建注册页面并在提交按钮单击时进行空字段验证。如果表单验证中有任何错误,那么我将阻止使用 jquery 调用默认方法,因此它不会调用按钮单击事件后面的代码。
问题:有时用户双击按钮,这是调用按钮单击事件后面的代码两次,两个数据库行插入具有相同的数据。
我尝试了很多解决方案,但不幸的是我无法取得任何成功。如果您有任何解决方案,请帮助我解决这个问题。
提前致谢,
实际上,如果验证为假,当使用 jquery 的 e.PreventDefault() 方法单击按钮时,我正在阻止 jquery 中的默认服务器端方法调用。不知道是什么问题,但是当我在客户端单击按钮上设置功能并根据验证而不是 e.PreventDefault 返回真/假时,技巧对我来说非常有用。
感谢所有对此问题发表评论的人。
例如,只需添加一个名为 'loading' 的变量并检查 ajax 调用是否忙:
在代码的顶部:
var loading = false;
然后在表单上提交:
$('#form').submit() {
if(loading)
return false;
loading = true;
//Ajax call
$.ajax({
type: "POST",
url: "somePage.php",
data: $('#form').serialize(),
success: function(response) {
loading = false;
//Your response code
}
});
}
试试这个它可能对你的 asp 按钮有帮助
<asp:Button runat="server" ID="btnSubmit" Text="Submit" OnClick="btnSubmit_Click" UseSubmitBehavior="false" OnClientClick="ValidationCode(event); return false;" />
<script>
function ValidationCode()
{
//Code of validtion
event.preventDefault();
if(true)
{
__dopostback:("btnSubmit","");
}
}
</script>
示例代码
客户端:
$("#submit").click(function () {
if (!YourvalidationFunction)
{
return false;
}
else {
//ajax_function is a folder contain Default.asmx page and insertNewRecord is function name (server side)
$.ajax({
type: "POST",
url: "ajax_function/Default.asmx/insertNewRecord",
data: "{ 'prefix': '" + dataString + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccessinsertingwcCall,
error: OnErrorCall
});
}
});
服务器端:
[WebMethod]
public string[] insertNewRecord(string prefix)
{
string status = "";
List<string> d = new List<string>();
try
{
// logic code for insertion if success set msg
status = "New record inserted";
}
catch (Exception ac)
{
status = " Error occurs";
}
d.Add(string.Format("{0}", status));
return d.ToArray();
}
one
在客户端使用。这将防止双击。
$("#button").one("click", function() {
// validate the form.
// if form is valid, submit form
});
另一种解决方案是使用布尔标志。
var submitting = false;
$("#button").click(function() {
if (!submitting) {
submitting = true;
if (formIsValid) {
submitting = false;
$("#form").submit();
} else {
submitting = false;
}
}
});
作为 js 方法中的第一件事,将 disabled 属性添加到您的按钮。
函数函数(事件){
$("#button").prop("disabled", true);
..... }