Question

这是我之前关于在注册时使用ajax检查用户名可用性的主题 jQuery: check username availability
现在当我测试系统时，ajax运行正常，但即使我使用现有的用户名，当我点击“提交”按钮时，表单也会被提交。我假设我需要一个额外的JavaScript来阻止这种情况发生，我该怎么做？非常感谢！

Answer 1

您需要阻止提交表单; jQuery documentation for "submit()"在这里很有帮助。假设您有一个检查用户名是否存在的方法（或者可以根据您的AJAX调用结果设置的标志）：

<form name="form" method="post" action="" />
...
<script>
  $("form").submit(function() {
    // Return false if the form should NOT be submitted.
    return !usernameExists(selectedUsername);
  });
</script>

或者从其他问题中将其纳入您的代码示例：

$('form').submit(function() {
  return data!='no';
});
if(data=="no"){
  $(this).html("This username already exists");
  //...

Answer 2

建议您在确定用户名是否重复时采取措施禁用提交按钮。

适合您现有的代码：

if(data=="no"){
   $(this).html("This username already exists");
   $('input[name=submit]').attr('disabled', true);
}
else{
   $(this).html("Username is available!");
   $('input[name=submit]').attr('disabled', false);
}

如果你想稍微重构一下：

$('input[name=submit]').attr('disabled', (data=="no"));
$(this).html((data=="no")?"This username already exists":"Username is available!");

javascript：如果用户名存在，则不提交表单

2 个答案: