PHP PDO+MySQL实现登录注册页面
connect.php——连接数据库，以后要连数据库直接include，不用再一写一大堆
header("Content-type: text/html;charset=utf-8");
$dbh = new PDO("mysql:host=localhost;dbname=DatabaseName", "username", "password");
$dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
?>login界面
<html>
<head>
<meta charset="utf-8">
<title>LOGINtitle>
<link href="login_css.css" rel="stylesheet" type="text/css">
head>
<body>
<table>
<form name="login" method="post">
<tr>
<td >用户名td>
<td>
<input type="text" name="username">
td>
tr>
<tr>
<td>密码td>
<td>
<input type="password" name="password">td>
tr>
<tr>
<td> td>
<td>
<input type="submit" name="submit" value="submit" width="100%">
<input type="reset" value="reset">
<input type="button" value="注册" onClick="window.location.href='register.php'">
button>td>
tr>
form>
table>
if(isset($_POST["submit"]))//只用submit存在才能执行
{
include("conect.php");
$usr=$_POST["username"];
$pwd=$_POST["password"];
// $_POST[" NAME "] 获取post到php的name="NAME"的值
// $_GET[" NAME"] 同上，为get的值
$cusr=$dbh->query("select username from user where username='$usr';");
$cpwd=$dbh->query("select username from user where username='$usr' and password='$pwd';");
//执行查询语句
$row1=$cusr->fetch(PDO::FETCH_BOTH);
//$row1为cusr执行后将返回结果转换成行数组格式
$row2=$cpwd->fetch(PDO::FETCH_BOTH);
if(empty($row1[0]))//若为空则表示没有匹配到任何条目
{
$dbh=null;//断开数据库
?>
<script>
alert ("用户名不存在");
login.onreset();
script>
}
else if(empty($row2[0]))//同上
{
$dbh=null;
?>
<script>
alert ("用户名或密码错误");
login.onreset();
script>
}
else
{
$dbh=null;
?>
<script>
alert ("欢迎! ");
window.location.href="home_page";
script>
}
}
?>
body>
html>注册
<html>
<head>
<meta charset="utf-8">
<title>注册title>
<script type="text/javascript" src="register_files/register_js.js">script>
<link href="register_files/register_css.css" rel="stylesheet" type="text/css">
head>
<body>
<form onSubmit="return check()" action="" method="post" name="info" >
<table>
<tr>
<td>*用户名：td>
<td><input type="text" name="username" required="required" onChange="check_usr()">td>
<td><span>用户名长度6-16位字母数字下划线组合，第一位必须为字母 span>td>
tr>
<tr>
<td><span id="usr"> span>td>
tr>
<tr>
<td>*密码：td>
<td><input type="password" name="password" required="required" onChange="check_pwd()">td>
<td><span>密码长度6-16位字母数字下划线 span>td>
tr>
<tr>
<td><span id="pwd"> span>td>
tr>
<tr>
<td>*再次输入密码td>
<td><input type="password" name="password_again" required="required" onChange="check_same()">td>
<td><span id="not_same"> span>td>
tr>
<tr>
<td>*QQ：td>
<td><input type="text" name="qqnum" required="required" onChange="check_qq()">td>
<td><span id="qq"> span>td>
tr>
<tr>
<td>*姓名：td>
<td><input type="text" name="name" required="required" >td>
<td><span> span>td>
tr>
<tr>
<td>td>
<td><center>
<input type="submit" name="submit" width="100%" value="submit">
center>td>
tr>
table>
form>
if(isset($_POST["submit"]))
{
include("connect.php");
mb_http_input("utf-8");
mb_http_output("utf-8");
$usr=$_POST["username"];
$pwd=$_POST["password"];
$qq=$_POST["qqnum"];
$name=$_POST["name"];
$sql = "insert into test.user values('$usr','$pwd',$qq,'$name');";
$stmt=$dbh->query("select username from user where username='$usr';");
//执行查询语句
$row=$stmt->fetch(PDO::FETCH_BOTH);
if(empty($row[0]))//判断是否存在
{
$dbh->exec($sql);
$dbh = null;
?>
<script>
alert ("注册成功！");
window.location.href="index.php";
script>
}
else
{
$dbh = null;
?>
<script>
alert ("用户名已存在！");
script>
}
}
?>
body>
html>注册input检查js
function check()
{
if(check_usr()&&check_pwd()&&check_same()&&check_qq())
return true;
else
return false;
//return false就会不执行submit
}
function check_usr()
{
var x;
x=document.forms["info"]["username"].value;
var pat=/^[a-zA-Z]\w{5,15}$/; //匹配正则表达式
if(x.search(pat)==-1)
{
var txt=document.getElementById("usr").innerHTML;
txt=txt.replace(txt,"用户名格式错误！");
document.getElementById("usr").innerHTML=txt;
return false;
}
else
{
var txt=document.getElementById("usr").innerHTML;
txt=txt.replace(txt," ");
document.getElementById("usr").innerHTML=txt;
return true;
}
}
function check_pwd()
{
var x;
x=document.forms["info"]["password"].value;
var pat=/^\w{6,16}$/;
if(x.search(pat)==-1)
{
var txt=document.getElementById("pwd").innerHTML;
txt=txt.replace(txt,"密码格式不正确！");
document.getElementById("pwd").innerHTML=txt;
return false;
}
else
{
var txt=document.getElementById("pwd").innerHTML;
var tmp=txt.replace(txt," ");
document.getElementById("pwd").innerHTML=tmp;
return true;
}
}
function check_same()
{
var x=document.forms["info"]["password"].value;
var y=document.forms["info"]["password_again"].value;
//从表中获取input信息
//document.forms["表单名"]["表单中一项的名"].value;
if(x!=y)
{
var txt=document.getElementById("not_same").innerHTML;
txt=txt.replace(txt,"两次输入不一致！");
document.getElementById("not_same").innerHTML=txt;
return false;
}
else
{
var txt=document.getElementById("not_same").innerHTML;
txt=txt.replace(txt," ");
document.getElementById("not_same").innerHTML=txt;
return true;
}
}
function check_qq()
{
var x;
x=document.forms["info"]["qqnum"].value;
pat=/[1-9][0-9]{4,}/;
if(x.search(pat)==-1)
{
var txt=document.getElementById("qq").innerHTML;
txt=txt.replace(txt,"QQ格式不正确！");
document.getElementById("qq").innerHTML=txt;
return false;
}
else
{
var txt=document.getElementById("qq").innerHTML;
txt=txt.replace(txt," ");
document.getElementById("qq").innerHTML=txt;
return true;
}
}html js css php学习笔记
css
@charset "utf-8";
/* CSS Document */
.hhh{
text-align:center；/*文本对齐方式*/
}
.testone{/*对所有class="testone"的标签应用*/
color:#D61AF0;
margin-left:10%;/*缩进*/
}
#one{/*对所有id="one"的标签应用*/
color:#EF0F13;
}
table{/*对所有table标签应用*/
width:60%;
}
td{/*对所有td标签应用*/
text-align: justify; /*文本的对齐方式*/
}
*{/*对所有标签应用*/
font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
/*font-family 依次使用这些字体，因为不同客户端字体库不同*/
font-size:xx-large;
font-style:italic;
font-weight:bold;
/*倾斜在font-style 里面，而加粗在font-weight里面*/
}
/*每一条属性后面都要有分号，最后一条可以不需要分号，但是作为习惯还是加上分号好*/JavaScript
function check()/*定义函数：function 函数名（参数）*/
{
if(check_usr()&&check_pwd()&&check_same()&&check_qq())
return true;
else
return false;
}
function check_usr()
{
var x;//声明变量
x=document.forms["info"]["username"].value;
// 从表单中根据name属性获得值
var pat=/^[a-zA-Z]\w{5,15}$/;
//正则表达式
if(x.search(pat)==-1)
{
/*
在字符串中调用search方法应用正则表达式，返回第一个匹配到的位置，
如果没匹配到则返回-1
*/
var txt=document.getElementById("usr").innerHTML;
/*
获取id="usr"标签中的内容，变量名为txt
*/
txt=txt.replace(txt,"用户名格式错误！");
document.getElementById("usr").innerHTML=txt;
/*标签id="usr"中的内容变为新的txt*/
return false;
}
else
{
var txt=document.getElementById("usr").innerHTML;
txt=txt.replace(txt," ");
document.getElementById("usr").innerHTML=txt;
return true;
}
}