Ajax+PHP+MySQL 登陆示例
PHP是一门很好的语言,可以很方便的开发web应用程序,下面介绍一下PHP如何通过AJAX方式实现登录功能:
1 login.php
登录界面中,javascript脚本用ajax方式异步请求dologin.php,dologin.php负责用户信息验证(包括验证码,php生成验证码可以自行搜索).登录界面的代码如下:
<?php session_start();?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>login</title>
<link rel="stylesheet" type="text/css" href="CSS/login.css" />
<script src="JS/ajaxhelper.js" type="text/javascript"></script>
<script src="JS/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
function chkForm() {
if (m$('username').value == "") { alert('用户名不能为空.');
m$('username').focus();
return false; }
if (m$('password').value == "") { alert('密码不能为空.');
m$('password').focus();
return false; }
if (m$('password').value != "" && m$('username').value != "") { var xmlhttp = createRequest();
if (xmlhttp) {
m$('loading').innerHTML = "<font color='red'>loading...</font>";
var username = m$('username').value;
var pwd = m$('password').value;
var code = m$('txtCode').value;
var url = "dologin.php";
xmlhttp.open("POST", url, true);
xmlhttp.onreadystatechange = ValidateResult;
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlhttp.send("username=" + escape(username) + "&password=" + escape(pwd) + "&code=" + escape(code)); } else {
alert('xmlHttp创建失败.'); } function ValidateResult() {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
if (xmlhttp.responseText != "") { //window.alert(xmlhttp.responseText);
var obj = eval("(" + xmlhttp.responseText + ")");
if (obj.result == true) {
alert("提示:" + obj.info);
window.location = 'index.php'; } else {
alert("错误:" + obj.info); }
} else {
window.alert("从服务器获取失败"); window.location.reload();
}
m$('loading').innerHTML = "";
}
} } } } function m$(id) {
return document.getElementById(id);
} function changeCode() {
var xmlhttp = createRequest();
if (xmlhttp) {
m$('loading').innerHTML = "<font color='red'>loading...</font>";
var dt = new Date().getTime();
// alert(dt);
var url = "function/imagecode.php?dummay" + escape(dt);
xmlhttp.open("GET", url, true);
xmlhttp.onreadystatechange = ValidateResult;
xmlhttp.send(null); } else {
alert('xmlHttp创建失败.'); } function ValidateResult() {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
var dt = new Date().getTime();
var url = "function/imagecode.php?dummay" + escape(dt);
m$('imgCode').src = "function/imagecode.php?dummay" + escape(dt);
m$('loading').innerHTML = "";
}
} }
} function showTool() {
$('#divToolTip').css("display", "block");
} function hideTool() {
$('#divToolTip').css("display", "none");
}
window.onload = initPage; function initPage() {
$('#divToolTip').css("display", "none");
}
</script>
</head>
<body>
<div style="background-color:#2A3F55; height:80px;"> </div>
<div style="min-height:500px;"> <div class="left"> <div style="margin:120px auto auto auto; height:300px; text-align:left">
<div style="font-size:26px;color:#2A3F55; text-align:center;">Ajax PHP Demo System
<img src="Images/appstorm-icon.png" alt="appcation storm image" style="position:relative;top:-18px; left:-12px; vertical-align:middle; text-align:center;font-size:10px; width:65px; height:46px;"/>
</div>
<br/>
<hr style="border:dashed thin #2A3F55;width:70%; text-align:center;"/>
<div style="font-size:13px;color:#999999; margin:20px auto 0 auto; padding-left:200px;">
Author:<a href="#" onmousemove="showTool();" onmouseout="hideTool();">wangming</a>
</div>
<div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">DateTime:2009-9-1</div>
<div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">Version:1.0.0</div>
<div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">Email:wangmingemail@163.com </div>
<div id="divToolTip">
<img src="Images/ming.jpg" height="86px;"/>
<span class="authordes">
<br/>
姓名:wangming<br/>
电商06-2<br/>
</span> </div> </div> </div> <div class="right"> <form>
<br/>
<table class="flogin">
<tr>
<td>用户名:</td>
<td><input type="text" name="username" id="username"/></td>
<td></td>
</tr>
<tr>
<td>密 码:</td>
<td><input type="password" name="password" id="password" /></td>
<td></td>
</tr>
<tr>
<td>验证码:</td>
<td>
<input type="text" name="txtCode" id="txtCode" size="12" />
<img src="function/imagecode.php" id="imgCode" alt="image code" height="22px;" style=" vertical-align:bottom;"/>
</td>
<td><input type="button" class="btnrefresh" onclick="changeCode();" /></td>
</tr>
<tr>
<td></td>
<td><input type="button" class="btnlogin" onclick="chkForm();" /></td>
<td></td>
</tr>
<tr>
<td></td>
<td><span id="loading"></span></td>
<td><span id="code"></span></td>
</tr> </table>
</form>
</div> </div>
<div style="background-color:#2A3F55; height:60px; margin:auto 0 0 0; clear:both; text-align:center; line-height:60px; color:#FFFFFF;font-size:12px;">
©Copyright 2015.
</div>
</body>
</html>
2 ajaxhelper.js
function createRequest() {
try {
request = new XMLHttpRequest();
} catch (tryMS) {
try {
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (otherMS) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
request = null;
}
}
}
return request;
}
function getActivatedObject(e) {
var obj;
if (!e) {
// early version of IE
obj = window.event.srcElement;
} else if (e.srcElement) {
// IE 7 or later
obj = e.srcElement;
} else {
// DOM Level 2 browser
obj = e.target;
}
return obj;
}
function addEventHandler(obj, eventName, handler) {
if (document.attachEvent) {
obj.attachEvent("on" + eventName, handler);
} else if (document.addEventListener) {
obj.addEventListener(eventName, handler, false);
}
}
3 dologin.php
<?php
session_start();
header("Content-type:text/html;charset=gb2312");//防止返回的中文乱码
$name=$_POST['username'];
$pwd=$_POST['password'];
$imagecode=$_POST['code'];
if(strtoupper($imagecode)==$_SESSION["code"])
{
include("conn/conn.php");
$sql="select studentName,studentPwd from tbstudent where studentId='".$name."'";
$result=mysql_query($sql,$conn);
if($row=mysql_fetch_assoc($result))
{
if($pwd==$row['studentPwd'])
{
$_SESSION['username']=$row['studentName'];
//echo "{'result':true,'info':'登陆成功!','code':'".$_SESSION["code"]."'}";
echo "{'result':true,'info':'登陆成功!'}"; }
else
{
echo "{'result':false,'info':'密码错误!'}";
}
}
else
{
echo "{'result':false,'info':'该用户不存在!'}";
}
}
else
{
echo "{'result':false,'info':'验证码错误!'}";
}
?>
4 conn.php
<?php
$conn=$mysql_connect("localhost","root", "");
mysql_select_db("bbs",$conn);
mysql_query("SET NAMES GB2312");
?>
5 user.php
<?php
class Users {
function Users() {
}
function checkLogin($username, $userpwd) {
try {
mysql_connect("localhost", "root", "123");
mysql_select_db("studentdb");
mysql_query("SET NAMES GB2312");
$sql = "select userid from tbuser where username='$username' and userpwd='" . md5(trim($userpwd)) . "'";
$result = mysql_query($sql);
if ($result) {
$arr = mysql_fetch_row($result);
$uid = $arr[0];
if ($uid != "") {
return "true|$uid login ok.$sql";
mysql_close();
} else {
return "false|login failed!$sql";
mysql_close();
}
} else {
return "false|$result link db failed!";
mysql_close();
}
}
catch(Exception $ex) {
return "false|$ex";
mysql_close();
}
}
function AddUser($name, $pwd) {
try {
mysql_connect("localhost", "root", "123");
mysql_select_db("studentdb");
mysql_query("set names gb2312");
$sql0 = mysql_query("select userid from tbuser where username='$name'");
$info0 = mysql_fetch_array($sql0);
$userid = $info0[0];
if ($info0 != false) {
return "false | $name is exisis.(id:$userid)";
}
$pwd = md5(trim($pwd));
$query = mysql_query("insert into tbuser(username,userpwd)values('$name','$pwd')");
$error = mysql_errno();
if ($query) {
return "true | add ok";
} else {
return "false | $error";
}
}
catch(Exception $ex) {
return "false | $ex";
}
}
function DeleteUser($name) {
mysql_connect("localhost", "root", "123");
mysql_select_db("studentdb");
mysql_query("set names gb2312");
$name = trim($name);
$sql0 = mysql_query("select userid from tbuser where username='$name'");
$info0 = mysql_fetch_array($sql0);
if ($info0 != false) {
if (mysql_query("delete from tbuser where username='$name'")) {
return "true | delete ok.(id:" . $info0[0] . ")";
} else {
return "false | 删除失败";
}
} else {
return "false | 删除失败 $name 不存在";
}
}
function UpdateUser($id, $name, $pwd) {
if (is_numeric(intval(trim($id)))) {
if ($id && $name && $pwd) {
mysql_connect("localhost", "root", "123");
mysql_select_db("studentdb");
mysql_query("set names gb2312");
$pwd = md5(trim($pwd));
$isexists = mysql_query("select * from tbuser where userid='$id'");
if (mysql_fetch_array($isexists)) {
$sql0 = mysql_query("update tbuser set username='$name',userpwd='$pwd' where userid= $id");
if ($sql0) {
return "ture | update ok";
} else {
return "false | 更新失败";
}
} else {
return "false | usrid=$id not exists.";
}
} else {
return "false |id=$id name=$name and pwd=$pwd .At least one of them is null.";
}
} else {
return "false | $id is not type of int.";
}
}
}
?>
与登录无关,只为了记录一下PHP如何在数据库MYSQL上实现CURD操作.
6 效果图
Ajax+PHP+MySQL 登陆示例的更多相关文章
- AJAX 与 MySQL
AJAX 与 MySQL AJAX 可用来与数据库进行交互式通信. AJAX 数据库实例 下面的实例将演示网页如何通过 AJAX 从数据库读取信息: 实例 Select a person: P ...
- JAVA使用jdbc连接MYSQL简单示例
以下展示的为JAVA使用jdbc连接MYSQL简单示例: import java.sql.DriverManager; import java.sql.ResultSet; import java.s ...
- Android客户端与服务端交互之登陆示例
Android客户端与服务端交互之登陆示例 今天了解了一下android客户端与服务端是怎样交互的,发现其实跟web有点类似吧,然后网上找了大神的登陆示例,是基于IntentService的 1.后台 ...
- jQuery Ajax： $.post请求示例
jQuery Ajax: $.post请求示例 leyangjun.html页面 <html> <head> <meta http-equiv="Content ...
- MySQL 登陆
#==========================登陆mysql ============================================ # 登陆用户名:-u,登陆IP: -h, ...
- jquery Ajax请求示例，jquery Ajax基本请求方法示例
jquery Ajax请求示例,jquery Ajax基本请求方法示例 ================================ ©Copyright 蕃薯耀 2018年5月7日 https: ...
- PHP MYSQL登陆和模糊查询
PHP MYSQL登陆和模糊查询 PHP版本 5.5.12 MYSQL版本 5.6.17 Apache 2.4.9 用的wampserver 一.PHPMYSQL实现登陆: 一共含有两个 ...
- (转)MySQL登陆后提示符的修改
MySQL登陆后提示符的修改 方法一:mysql命令行修改方式 mysql>prompt \u@night \r:\m:\s-> PROMPT set to '\u@night \r:\m ...
- MySql登陆密码忘记了 怎么办？
MySql登陆密码忘记了 怎么办?root密码:连root密码忘记没用root进修改mysql数据库user表咯 root密码: 方法一:MySQL提供跳访问控制命令行参数通命令行命令启MySQL服务 ...
随机推荐
- CSS技能汇总，研究及实践
最近一直在研究CSS,因为发现实践中大部分时间都在写CSS,且自己感觉写的很烂,虽然以前看的很多,但却很少有去实践过,更别提研究了,现在发现根本就不是你懂你就会,很多都是你用着用着才真的会了的,于是现 ...
- datagridview控件去除页码
开启datagridview的分页功能,默认页码是是显示的 为了不让页码显示,可以在绑定数据的是将其隐藏掉 gvLogName.BottomPagerRow.Visible = false; gvLo ...
- Spring学习总结（六）——Spring整合MyBatis完整示例
为了梳理前面学习的内容<Spring整合MyBatis(Maven+MySQL)一>与<Spring整合MyBatis(Maven+MySQL)二>,做一个完整的示例完成一个简 ...
- Spark入门实战系列--7.Spark Streaming（上）--实时流计算Spark Streaming原理介绍
[注]该系列文章以及使用到安装包/测试数据 可以在<倾情大奉送--Spark入门实战系列>获取 .Spark Streaming简介 1.1 概述 Spark Streaming 是Spa ...
- lucene 的评分机制
lucene 的评分机制 elasticsearch是基于lucene的,所以他的评分机制也是基于lucene的.评分就是我们搜索的短语和索引中每篇文档的相关度打分. 如果没有干预评分算法的时候,每次 ...
- 实现在GET请求下调用WCF服务时传递对象（复合类型）参数
WCF实现RESETFUL架构很容易,说白了,就是使WCF能够响应HTTP请求并返回所需的资源,如果有人不知道如何实现WCF支持HTTP请求的,可参见我之前的文章<实现jquery.ajax及原 ...
- 实现winform DataGridView控件判断滚动条是否滚动到当前已加载的数据行底部
判断 DataGridView控件滚动条是否滚动到当前已加载的数据行底部,其实方法很简单,就是为DataGridView控件添加Scroll事件,然后写入以下代码就可以了,应用范围:可实现分部加载数据 ...
- 3.openstack之mitaka搭建keystone认证服务
认证服务keystone部署 一:安装和配置服务 1.建库建用户 mysql -u root -p CREATE DATABASE keystone; GRANT ALL PRIVILEGES ON ...
- PHPcms 系统简单使用
1.站点/发布点的新建 1.1 发布点的新建: 发布点是设置站点与服务器之间的链接配置. 设置 - 发布点管理 - 添加发布点 发布点名:可以与接下来的站点名称相同 ftp服务器:用于设置PHPcms ...
- WPF系列:画图
Line 在两个坐标点之间画一条直线,通过四个属性设置它的起始和结束 <Line Stroke="Blue" StrokeThickness="3" X1 ...