Question

这是让ajax签出用户存在的表单。

<!DOCTYPE html>

<html>
    <head><title>Register new user!</title>
    <script src="jquery-1.7.1.min.js"></script>
    </head>
    <body>
        Username:
        <input type="text" name="username" id="username"/><span id="user"></span><br/>
        Password:
        <input type="password" name="password" id="password"/><br/>
        <input type="button" value="Register" name="submit" id="submit" onclick="register_user();"/>
    </body>
    <script>
        function register_user()
        {
            $.ajax(
                {
                    type:"POST",
                    data:username,
                    url:"userexists.php"                    
                })
            .fail(function()
                  {
                    $('#user').html("This user already exists");
                  }
            );                
        }
    </script>
</html>

这是userexists.php模块

<?php
    // connection to the db
    define(IPHOST,"localhost");
    define(DBPASSWORD,"");
    define(DBUSER,"root");
    define(DATABASE,"ajaxtest");
    define(TABLENAME,"at");

    $conn=mysql_connect(IPHOST,DBUSER,DBPASSWORD) or die(mysql_error());
    mysql_select_db(DATABASE) or die(mysql_error());
    $username=$_POST('username');
    $sql="SELECT username FROM ".TABLENAME." WHERE username=".$username;
    $query=mysql_query($sql);
    if(0!=mysql_numrows($query))
    {
        //
    }
    else
    {

    }
?>

但是我很难弄清楚ajax函数是如何工作的，例如，在我知道输入的用户名已被使用后，我应该输入空白字段？我根本不懂阿贾克斯。

[更新] 谢谢，我现在明白了，我有几个答案，不知道选哪一个作为最佳答复。没有选择全部的选项。

Answer 1

您的代码中存在很多错误，请尝试以下代码：

<!DOCTYPE html>

<html>
    <head><title>Register new user!</title>
    <script src="jquery-1.7.1.min.js"></script>
    </head>
    <body>
        Username:
        <input type="text" name="username" id="username"/><span id="user"></span><br/>
        Password:
        <input type="password" name="password" id="password"/><br/>
        <input type="button" value="Register" name="submit" id="submit" onclick="register_user();"/>
    </body>
    <script>
        function register_user()
        {
            $.ajax({
                type: "POST",
                data: {
                    username: $('#username').val(),
                },
                url: "userexists.php",
                success: function(data)
                {
                    if(data === 'USER_EXISTS')
                    {
                        $('#user')
                            .css('color', 'red')
                            .html("This user already exists!");
                    }
                    else if(data === 'USER_AVAILABLE')
                    {
                        $('#user')
                            .css('color', 'green')
                            .html("User available.");
                    }
                }
            })              
        }
    </script>
</html>

对于你的php代码：

<?php
    // connection to the db
    define(IPHOST,"localhost");
    define(DBPASSWORD,"");
    define(DBUSER,"root");
    define(DATABASE,"ajaxtest");
    define(TABLENAME,"at");

    $conn=mysql_connect(IPHOST,DBUSER,DBPASSWORD) or die(mysql_error());
    mysql_select_db(DATABASE) or die(mysql_error());

    $username = mysql_real_escape_string($_POST['username']); // $_POST is an array (not a function)
    // mysql_real_escape_string is to prevent sql injection

    $sql = "SELECT username FROM ".TABLENAME." WHERE username='".$username."'"; // Username must enclosed in two quotations

    $query = mysql_query($sql);

    if(mysql_num_rows($query) == 0)
    {
        echo('USER_AVAILABLE');
    }
    else
    {
        echo('USER_EXISTS');
    }
?>

Answer 2

由于您是AJAX的新手，让我在尝试时帮助您更好地解释一下。

AJAX代表异步Javascript和XML。使用它，您可以向另一个页面发出请求，并根据另一页返回的结果使原始页面的行为不同。

那么这有用吗？好;您甚至可以在“用户名”字段上设置onblur，以检查远程脚本以查看用户名是否已被使用。（你现在已经在当前的设置中做了。干得好！）

首先; .fail（）告诉您当前的页面“如果ajax请求失败，请让我们执行此代码”。这称为回调。回调是异步请求完成时要执行的javascript代码的函数。

所以你想要实际做的是使用.done（）方法。这告诉你的jQuery请求“嘿，当你完成这个请求时，做这段代码。当你这样做时，我会坐在这里处理其他任何事情。”

所以你可以看到使用.done（）和.fail（）之间存在细微差别，但我可以看到你很容易与.fail（）成为ajax的新手。

让我们回到你当前的问题。让我们将ajax修改为更像这样的东西：

$("#submit").click(function()
{
    $.ajax({
      type: "POST",
      data: "username="+$("#username").val(),
      url: "userexists.php"                    
    })
    .done(function(response){
        $('#user').html(response);
    });
});

这样做就是为你的提交按钮绑定一个onclick处理程序，其id为“submit”。所以现在你可以删除onclick =“register_user”。其次，它说，“嘿网页，请使用参数名称username发送userexists.php用户名文本框值。当您完成该请求后，将#user的html设置为响应。

关闭它就行了。

现在你的PHP文件，你可以这样做：

<?php
    // connection to the db
    define(IPHOST,"localhost");
    define(DBPASSWORD,"");
    define(DBUSER,"root");
    define(DATABASE,"ajaxtest");
    define(TABLENAME,"at");

    $conn = mysql_connect(IPHOST,DBUSER,DBPASSWORD) or die(mysql_error());
    mysql_select_db(DATABASE) or die(mysql_error());

    $username = mysql_real_escape_string($_POST['username']); // Stop some MySQL injections

    $sql="SELECT username FROM ".TABLENAME." WHERE username='$username'";
    $query=mysql_query($sql);
    if(mysql_numrows($query) == 0)
    {
        echo 'Username is available!'
    }
    else
    {
        echo 'Sorry, username is in use.';
    }
?>

因此，一旦您的脚本执行查询，如果它找到结果，它将在HTML div中说“用户名可用！”。否则，如果找到匹配，则显示“抱歉，用户名不可用”。

希望这有助于您更好地了解ajax！

Answer 3

技术上取决于你。（例如）您可以为“用户存在”返回“1”，为“用户不存在”返回“0”，或返回更详细的XML。客户端应用程序（Javascript）将读取返回的结果并向用户打印出适当的消息。

如果您的函数实际失败（服务器端错误等），则应使用.fail方法。所以它似乎不适合你想要做的事情。我会在你的“.done（）”代码中输入如上所述的返回值的测试，并打印出正确的消息。

使用Javascript：

.done(function ( data ) {
  if(data == "0")
    alert("Your username is OK");
  else
    alert("Your username is already used");
});

PHP：

if(0!=mysql_numrows($query))
{
    echo "0";
}
else
{
    echo "1";
}

Answer 4

当服务器返回意外数据时，使用ajax中的函数.fail。但你的PHP代码不会返回任何东西。使用这样的东西：

function register_user()
    {
        $.ajax(
            {
                type:"POST",
                data:username,
                url:"userexists.php"                    
            })
        .done(function(_return)
              {
                if(_return)                                                                                                                                                               
                {
                   if(_return['status']=='yes')
                   {
                     $('#user').html(_return['msg']);
                   }
                 }
              })
        .fail(function());                
    }

在php中：

if(0!=mysql_numrows($query))
{
      $return = array('status'=>'yes',
                      'msg'=>"User alredy exist");

      echo json_encode($return);
      return true;
}

现在，您可以使用许多状态添加更多条件，并在javascript中解析它。

ajax调用检查重复数据

4 个答案: