使用jQuery检查用户名可用性

时间:2016-05-20 14:44:46

标签: javascript php jquery html

我在注册时使用此功能检查用户名可用性,如果用户名存在,则禁用提交按钮。我使用php脚本检查数据库中是否存在用户名。代码在我的本地服务器上运行得很好,但是当托管在Godaddy服务器上时,我在提交或尝试导航到另一个页面时出现以下错误:

Empty Response

空洞回复后,我无法访问我的网站大约一分钟,然后就可以了。

我尝试了很多东西,比如在所有其他js文件之前调用jquery.js文件,但是没有什么对我有用。

我对jQuery和javascript不是很了解。谢谢你的建议。

ere是脚本和HTML表单:



function check_availability_username() {

  var min_chars = 4;
  var max_chars = 30;
  var re = /^\w+$/;
  var characters_error1 = 'Minimum amount of chars is 4';
  var characters_error2 = 'Maximum amount of chars is 30';
  var characters_error3 = 'Chars can be only letters, numbers and underscores!';
  var checking_html = 'Checking...';

  var username = $('#username').val();

  $.post("check_username.php", {
      username: username
    },
    function(result) {

      if (result == 1) {

        if ($('#username').val().length < min_chars) {
          $('#username_availability_result').html(characters_error1);
          $('input[name=submit]').attr('disabled', true);
        } else if ($('#username').val().length > max_chars) {
          $('#username_availability_result').html(characters_error2);
          $('input[name=submit]').attr('disabled', true);
        } else if (!re.test($('#username').val())) {
          $('#username_availability_result').html(characters_error3);
          $('input[name=submit]').attr('disabled', true);
        } else {
          $('#username_availability_result').html(username + ' is Available');
          $('input[name=submit]').attr('disabled', false);
        }
      } else {
        $('#username_availability_result').html(username + ' is not Available');
        $('input[name=submit]').attr('disabled', true);
      }
    });

  if (event.which == 13 || event.keyCode == 13) {

    $.post("check_username.php", {
        username: username
      },
      function(result) {

        if (result == 0) {

          $('#username_availability_result').html(username + ' is not Available');
          $('input[name=submit]').attr('disabled', true);
        }
      });
  }
  
  $('#submit').click(function() {
    $.post("check_username.php", {
        username: username
      },
      function(result) {

        if (result == 0) {

          $('#username_availability_result').html(username + ' is not Available');
          $('input[name=submit]').attr('disabled', true);
        }
      });

  });
}
&#13;
<form id="login-id" action="suscribe-form.php" method="POST" onkeyup="return check_availability_username();">
  <div class="form-group">
    <label for="username">Username</label>
    <input type="text" class="form-control button-or-space" name="username" id="username" value="" minlength="4" maxlength="25" required pattern="\w+">
    <input type='hidden' id='check_username_availability' value='Check Availability'>&nbsp;<span id='username_availability_result' name='username_availability_result'></span>
  </div>
  <div class="form-group">
    <label for="password1">Password</label>
    <input type="password" class="form-control button-or-space" name="password1" id="password1" value="" minlength="8" maxlength="60" required pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" onchange="form.password2.pattern = this.value;">
  </div>
  <div class="form-group">
    <label for="password2">Confirm password</label>
    <input type="password" class="form-control button-or-space" name="password2" value="" minlength="8" maxlength="60" required pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}">
  </div>
  <div class="form-group pull-right">
    <input type="submit" name="submit" id="submit" value="Register" class="btn btn-success button-or-space">
  </div>
</form>    
&#13;
&#13;
&#13;

这是php脚本:

<?php    

mysql_connect('localhost', 'root', '');
mysql_select_db('DB');

$username = mysql_real_escape_string($_POST['username']);

$result = mysql_query('select username from user where username = "'.$username.
  '"');

if (mysql_num_rows($result) > 0) {
  echo 0;
} else {
  echo 1;
}

?>

2 个答案:

答案 0 :(得分:0)

我终于找到了解决方案。问题不是来自jQuery或php脚本,我只改变了我在表单中调用函数的方式:onkeyup到onchange,现在它就像魅力一样。我希望这个提示可以避免让别人失去像我一样的时间。感谢你们的建议。

答案 1 :(得分:-2)

如果您收到500错误,表明数据库连接存在问题。 检查用于数据库连接的包含文件和连接变量。

希望能奏效。