Javascript 不允许用户使用php和MySQL选择现有用户名，如果用户选择现有用户名，则显示警告框

我正在使用php和MySQL，我的问题是如何在javascript中生成函数或代码，在选择已经存在的用户名时提醒用户，并且不允许他们提交注册表

---

谢谢

我已经使用jQuery和PDO完成了这项工作，所以这是一个ajax用户名检查

这是我的jQuery

$(document).ready(function() {

    $('#username').keyup(function() {

        var username = $('#username').val();
        if(username == "" || username.length < 4) {

            $('#username').css('border', '3px #CCC solid');
            $('#tick').hide();
        }
        else{

            $.ajax({
               type: "POST",
               url: "util/UsernameCheck.php",
               data: 'username='+ username,
               cache: false,
               success: function(response) {

                    if(response == 1) {

                        $('#username').css('border', '3px #C33 solid'); 
                        $('#tick').hide();
                        $('#cross').fadeIn();
                    }
                    else {

                        $('#username').css('border', '3px #090 solid');
                        $('#cross').hide();
                        $('#tick').fadeIn();
                    }
                },
                error: function(xhr, textStatus, errorThrown) {
                   alert('request failed');
                }
            });
        }
    });
});

$（文档）.ready（函数（）{
$（'#username'）.keyup（函数（）{
var username=$（'#username'）.val（）；
如果（username==“”| | username.length<4）{
$（'#username'）.css（'border'，'3px#CCC solid'）；
$（“#勾选”）.hide（）；
}
否则{
$.ajax({
类型：“POST”，
url:“util/UsernameCheck.php”，
数据：“用户名=”+用户名，
cache:false，
成功：功能（响应）{
如果（响应==1）{
$（'#username'）.css（'border'，'3px#C33 solid'）；
$（“#勾选”）.hide（）；
$（'交叉'）.fadeIn（）；
}
否则{
$（'#username'）.css（'border'，'3px#090 solid'）；
$（“#交叉”）.hide（）；
$（'勾选'）.fadeIn（）；
}
},
错误：函数（xhr、textStatus、errorshown）{
警报（“请求失败”）；
}
});
}
});
});

#勾号和#叉号只是根据用户名的使用情况隐藏/显示的图像

UsernameCheck.php

<?php

// your database info here
require '../config.php';

try {
    // create a new instance of a PDO connection
    $db = new PDO(DB_TYPE.':host='.DB_HOST.';dbname='.DB_NAME, DB_USER, DB_PASS);
    $db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
}
catch(PDOException $e) {
    // if the connection fails, display an error message
    echo 'ERROR: ' . $e->getMessage();
}

if(isset($_POST['username']) && !empty($_POST['username'])) {

    $username = $_POST['username'];

    $sql = 'SELECT username FROM users WHERE username = :username';

    $stmt = $db->prepare($sql);
    $stmt->bindValue('username', $username);
    $stmt->execute();
    $count = (int) count($stmt->fetchAll());

    echo $count;
}

?>

---

alert（'此线程已存在！'）；如何使用堆栈交换在上面的帖子中添加html