AJAX を使用して重複したユーザー名を検出する方法

今回は、AJAX がユーザー名が重複しているかどうかを検出する方法について説明します。 最初にレンダリングを示し、次にコードを示します。レンダリングは次のとおりです。

ユーザー名が一意であるかどうかを確認するための簡単な例を以下に書きます (直接入力します)。コード):

フロントエンド インターフェイス:

nbsp;html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


<meta>
<title>检测用户名是否唯一</title>
<style>
<!--
#toolTip {
  position:absolute;
  left:331px;
  top:39px;
  width:98px;
  height:48px;
  padding-top:45px;
  padding-left:25px;
  padding-right:25px;
  z-index:1;
  display:none;
  color:red;
  background-image: url(images/tooltip.jpg);
}
-->
</style>

                    

  

  

                                                                                                       

用户名：
密码：
确认密码：
E-mail：

     

AJAX ファイル:

<script>
function createRequest(url) {
  http_request = false;
  if (window.XMLHttpRequest) {                  // 非IE浏览器
    http_request = new XMLHttpRequest();             //创建XMLHttpRequest对象
  } else if (window.ActiveXObject) {               // IE浏览器
    try {
      http_request = new ActiveXObject("Msxml2.XMLHTTP");  //创建XMLHttpRequest对象
    } catch (e) {
      try {
        http_request = new ActiveXObject("Microsoft.XMLHTTP"); //创建XMLHttpRequest对象
      } catch (e) {}
    }
  }
  if (!http_request) {
    alert("不能创建XMLHttpRequest对象实例！");
    return false;
  }
  http_request.onreadystatechange = getResult;            //调用返回结果处理函数
  http_request.open(&#39;GET&#39;, url, true);                //创建与服务器的连接
  http_request.send(null);                    //向服务器发送请求
}
function getResult() {
  if (http_request.readyState == 4) {       // 判断请求状态
    if (http_request.status == 200) {      // 请求成功，开始处理返回结果
      document.getElementById("toolTip").innerHTML=http_request.responseText; //设置提示内容
      document.getElementById("toolTip").style.display="block";  //显示提示框
    } else {              // 请求页面有错误
      alert("您所请求的页面有错误！");
    }
  }
}
function checkUser(userName){
  if(userName.value==""){
    alert("请输入用户名！");userName.focus();return;
  }else{
    createRequest(&#39;checkUser.jsp?user=&#39;+userName.value);
  }
}
</script>

jsp ファイル:

この例では、

データベースに接続

せず、単に登録ユーザーを表すために配列を使用しています。

-1){
    out.println("很抱歉，该用户名已经被注册！");     //输出检测结果
  }else{
    out.println("恭喜您，该用户名没有被注册！");     //输出检测结果
  }
%>

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

プロジェクトにおける Ajax と jsonp の実践的な概要

Ajax を使用して電子メールとユーザー名の一意性を検証する方法

以上がAJAX を使用して重複したユーザー名を検出する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。