PHP经典项目案例-（一）博客管理系统4

本篇使用Ajax实现页面无刷新验证用户名是否存在。

七、注册页面实现

1、注册页面设计

<tr>
    <!-- 注册表 --> 
      <td colSpan=3 valign="baseline" style="BACKGROUND-IMAGE: url( images/bg.jpg); VERTICAL-ALIGN: middle; HEIGHT: 450px; TEXT-ALIGN: center"><br>
         
      </td> 
    </tr>

登入後複製

2、输入框失去焦点后调用的javascript函数实现：fun.js：

function chkUserName(){
    var c = document.getElementById(&#39;txt_regname&#39;);
    var d = c.value;
    var id;
    if(d==""){      
        document.getElementById(&#39;l1&#39;).innerText="请输入用户名";
        document.getElementById(&#39;ll1&#39;).innerText="";
    }else{
        var xmlObj;
        xmlObj = new XMLHttpRequest();  
        xmlObj.open(&#39;POST&#39;,&#39;chk.php?d=&#39;+d,true);
        xmlObj.onreadystatechange = callBackFun;
        xmlObj.send(null);
        function callBackFun() {
            if(xmlObj.readyState == 4&&xmlObj.status ==200){
                if(xmlObj.responseText==&#39;y&#39;){
                    document.getElementById(&#39;l1&#39;).innerText="&#215;";
                    document.getElementById(&#39;ll1&#39;).innerText="";
                }else{
                    document.getElementById(&#39;l1&#39;).innerText="";
                    document.getElementById(&#39;ll1&#39;).innerText="√";
                }
            }
        }
    }
}
function chkRealName(){
    var c = document.getElementById(&#39;txt_regrealname&#39;);
    var d = c.value;
    if(d==""){      
        document.getElementById(&#39;l4&#39;).innerText="请输入真实姓名";
        document.getElementById(&#39;ll4&#39;).innerText="";
    }else{
        document.getElementById(&#39;l4&#39;).innerText="";
        document.getElementById(&#39;ll4&#39;).innerText="√";
    }
}
function chkPwd(){
    var p = document.getElementById(&#39;txt_regpwd&#39;).value;
    var c = document.getElementById(&#39;ll1&#39;).innerText;
    if(c=="√"){
        if(p==""){
            document.getElementById(&#39;l2&#39;).innerText="请输入密码";
        }
        else if(p.length<3){
        document.getElementById(&#39;l2&#39;).innerText="&#215;";
        document.getElementById(&#39;ll2&#39;).innerText="";
        }else{
        document.getElementById(&#39;l2&#39;).innerText="";
        document.getElementById(&#39;ll2&#39;).innerText="√";
        }
    }
}
function chkRePwd(){
    var p = document.getElementById(&#39;txt_regpwd&#39;).value;
    var rp = document.getElementById(&#39;txt_regpwd2&#39;).value;
    var c = document.getElementById(&#39;ll2&#39;).innerText;
    if(c=="√"){
    if(p==rp){
        document.getElementById(&#39;ll3&#39;).innerText="√";
        document.getElementById(&#39;l3&#39;).innerText="";
    }else{
        document.getElementById(&#39;ll3&#39;).innerText="";
        document.getElementById(&#39;l3&#39;).innerText="&#215; 密码不一致";
    }
    }
}
function chkBirth(){
    var c = document.getElementById(&#39;birth&#39;);
    var d = c.value;
    if(d==""){      
        document.getElementById(&#39;l6&#39;).innerText="请输入出生日期";
        document.getElementById(&#39;ll6&#39;).innerText="";
    }else{
        document.getElementById(&#39;l6&#39;).innerText="";
        document.getElementById(&#39;ll6&#39;).innerText="√";
 
    }
}
function chkEmail(){
    var e = document.getElementById(&#39;txt_regemail&#39;).value;
    if(e==""){      
        document.getElementById(&#39;l5&#39;).innerText="请输入邮箱";
        document.getElementById(&#39;ll5&#39;).innerText="";
    }else{
        document.getElementById(&#39;l5&#39;).innerText="";
        document.getElementById(&#39;ll5&#39;).innerText="√";
    }
}

登入後複製

3、Ajax验证用户名使用的处理文件chk.php:

<?php
    require_once &#39;Conn/SqlHelper.class.php&#39;;
    $chk = $_REQUEST[&#39;d&#39;];
    $sqlHelper = new SqlHelper();
    $sql = "select * from tb_user where regname=&#39;$chk&#39;;";
    $res = $sqlHelper->execute_dql($sql);
    $s = $res->fetch_assoc();
    if(count($s)!=0){
        echo &#39;y&#39;;
    }else{
        echo &#39;n&#39;;
    }

登入後複製

4、注册后将用户添加到数据库registerdeal.php

<?php
session_start();
include "Conn/SqlHelper.class.php";
$sqlHelper = new SqlHelper();
$UserName=$_POST[&#39;txt_regname&#39;];
$sql="select * from tb_user where regname = &#39;$UserName&#39;";
$res = $sqlHelper->execute_dql($sql);
$result=$res->fetch_assoc();
if (count($result)!=0){
    echo ("<script>alert(&#39;用户名已被注册！&#39;);history.go(-1);</script>");
    exit();
}
$_SESSION[&#39;username&#39;]=$_POST[&#39;txt_regname&#39;];
$regname=$_POST[&#39;txt_regname&#39;];
$regrealname=$_POST[&#39;txt_regrealname&#39;];
$regpwd=$_POST[&#39;txt_regpwd&#39;];
$regbirthday=$_POST[&#39;txt_birthday&#39;];
$regemail=$_POST[&#39;txt_regemail&#39;];
$regcity=$_POST[&#39;txt_province&#39;].$_POST[&#39;txt_city&#39;];
$regico=$_POST[&#39;txt_ico&#39;];
$regsex=$_POST[&#39;txt_regsex&#39;];
$regqq=$_POST[&#39;txt_regqq&#39;];
$reghomepage=$_POST[&#39;txt_reghomepage&#39;];
$regsign=$_POST[&#39;txt_regsign&#39;];
$regintroduce=$_POST[&#39;txt_regintroduce&#39;];
$ip=getenv(REMOTE_ADDR);
$sql = "Insert Into tb_user (regname,regrealname,regpwd,regbirthday,regemail,regcity,regico,regsex,regqq,reghomepage,regsign,regintroduce,ip,fig)".
" Values (&#39;$regname&#39;,&#39;$regrealname&#39;,&#39;$regpwd&#39;,&#39;$regbirthday&#39;,&#39;$regemail&#39;,&#39;$regcity&#39;,&#39;$regico&#39;,&#39;$regsex&#39;,&#39;$regqq&#39;,&#39;$reghomepage&#39;,&#39;$regsign&#39;,&#39;$regintroduce&#39;,&#39;$ip&#39;,0)";
$INS=$sqlHelper->execute_dml($sql);
echo "<script> alert(&#39;用户注册成功！&#39;);</script>";
echo "<script> window.location=&#39;index.php&#39;;</script>";
?>