Question

许多网站都有“检查可用性”按钮。我希望有这个。但这似乎只有在使用Ajax和Jquery时才可用。有没有办法让我只用PHP和Javascript来做这件事。因为我是一名初学程序员，没有使用Ajax或Jquery的技能。

我想要的是，我有一个用户名字段。我打字用户名，我想检查名称是否可用。如果此人点击了检查可用性按钮，我想要一个弹出窗口，上面写着“此用户名可用”或“此用户名已被使用”。

如果有人知道如何在PHP和Javscript中做到这一点，我将非常有必要知道。

Answer 1

使用ajax（和jquery）比看起来容易。在您的客户端，您有这样的请求：

$.ajax({
    url: 'usernameChecker.php',
    dataType: 'GET',
    data: 'username=' + $("#yourUserNameFieldID").val(),
    success: function(result)
    {
        alert(result);
    }
});

当然你需要包含jquery来实现它。 jQuery可以轻松进行ajax调用。

在服务器端，您可以使用以下内容：

<?php
if(isset($_GET["username"]))
{
    // check username
    if(username_is_free) 
    // of course this needs to be a bit different, but you'll get the idea
    {
       echo "Username is free!";
    }
    else echo "Username is taken!";
}
?>

Answer 2

$(document).ready(function(){
    // available-button is the ID of the check availability button
    //checkAvailability.php is the file which gets the username param and checks if its available
    // user is the id of the input text field where the user enter the username
    // available-message is the id of a div which displays the availability message. Use this instead of alert
    $('#available-button').click(function() {
        $.ajax({
            type : 'POST',
            url : 'checkAvailability.php',
            data: {
                username : $('#user').val()
            },
            success : function(data){
                $('#available-message').text(data);
            },
            error : function(XMLHttpRequest, textStatus, errorThrown) {
                alert("Some Error occured. Try again")
            }
        });
        return false;
    });
});

Answer 3

使用jQuery ajax，这是最好的＆amp;简单的方法。

使用Ajax向php页面发送请求，该页面将使用username作为参数（get或post方法，您可以在ajax调用中指定），然后在服务器端搜索数据库中的username的唯一性＆amp;返回适当的回应。

Answer 4

有没有办法让我只用PHP和Javascript来做这件事。因为我是一名没有技能的初级程序员使用Ajax或Jquery。

我认为你会发现在jQuery中创建一个AJAX请求要比在纯javascript中编写一个简单得多。

由于jQuery是Javascript的扩展，您可以使用最小的jQuery向服务器发出请求，然后使用纯javascript处理响应。

使用jQuery AJAX：

http://api.jquery.com/jQuery.ajax/

$.ajax({
  url: "test.html",
  context: document.body,
  success: function(){
    $(this).addClass("done");
  }
});

在这里，您可以将success部分更改为：

success: function(data){
        if (data == 1){
            $(".message").html("Available");
        }
        else {
            $(".message").html("Already Taken");
        }
      }

Answer 5

我建议您使用jQuery执行此任务。

jQuery（或其他Javascript库）将使任务变得简单，而不使用其中一个就可以完成。

jQuery docs很好，因为有很多online tutorials符合您的要求。

您将从花时间了解jQuery库中获益。

我想在我的注册页面上创建一个可用性按钮

5 个答案: