html和php编写系统登录和信息查询
来源:互联网 发布:如何关淘宝店铺 编辑:程序博客网 时间:2024/05/14 21:21
登录界面源码:
文件1名: RequestLogin.html
<!DOCTYPE html PUBLIC><!--[if IE 7]> <html class="no-js ie7"> <![endif]--><!--[if IE 8]> <html class="no-js ie8"> <![endif]--><!--[if IE 9]> <html class="no-js ie9"> <![endif]--><!--[if gt IE 9]><!--> <html class="no-js"> <!--<![endif]--><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>系统登录</title> <style> body {height:100px;font-size:16px;color:#048bcc;margin:5%;} .divFrame {width:260px;border:solid 1px #666} .divFrame .divTitle {padding:5px;background-color:#eee} .divFrame .divContent {padding:5px} .divFrame .divContent .clsShow {font-size:16px;} .btn {border:#666 1px solid;width:80px;} .txt {width:150px;margin-bottom:5px;margin-top:5px;} .clsError {margin-bottom:5px;margin-top:5px;} </style> <script src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript"> $(function(){ $.ajax({ url:"Login.html", dataType:"html", success:function(HTML){ //将页面内容置入表单 $("#frmUserLogin").html(HTML); $("#btnLogin").click(function(){ //“登录”按钮单击事件 var strTxtName = $("#txtName").val(); var strTxtPass = $("#txtPass").val(); $.ajax({ type:"POST", url:"Login.php", //登录处理页 dataType:"html", //传送请求数据 data:{txtName:strTxtName, txtPass:strTxtPass}, //登录成功后返回的数据 success:function(strValue){ //根据返回值进行状态显示 //alert("返回值:"+strValue); if(strValue == 1){ $("#frmUserLogin").load("LoginOK.html"); //alert("操作提示:登录成功!"); $("#divUserInfo").load("getUserInfo.html"); } else{ $("#divError").show().html("<hr />用户名或密码错误!"); } } }) }); $("#btnReset").click(function(){ //“取消”按钮单击事件 $("#divError").empty(); $("#txtName").empty(); $("#txtPass").empty(); }) } }) }) </script></head><body><center> <form id="frmUserLogin" ></form> <div class="divContent"> <div id="divUserInfo"></div> </div> </center> </body></html>
登录页面:
文件2: Login.php
<?php$strName = $_POST["txtName"]; //解码姓名字符$strPass = $_POST["txtPass"]; //解码密码字符$blnLogin = false;if($strName == "admin" && $strPass == "123456"){ $blnLogin = true;}echo $blnLogin;//return $blnLogin;?>
文件3: LoginOK.html
<div class="divFrame"> <div class="divTitle"> <span>信息查询</span> </div> <div class="divContent"> <div class="clsShow"> <div>操作提示:登录成功!</div> <div style="text-align:right;"> <input type="button" onclick="window.location.href='RequestLogin.html';" value="退出登录"/> </div> </div> </div></div>
文件4: getUserInfo.html
<!DOCTYPE html PUBLIC><!--[if IE 7]> <html class="no-js ie7"> <![endif]--><!--[if IE 8]> <html class="no-js ie8"> <![endif]--><!--[if IE 9]> <html class="no-js ie9"> <![endif]--><!--[if gt IE 9]><!--> <html class="no-js"> <!--<![endif]--><!--<html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>传统的JS实现AJAX</title> <style> body {font-size:20px;color:#048bcc;} .divFrame {width:260px;border:solid 1px #666} .divFrame .divTitle {padding:5px;background-color:#eee} .divFrame .divContent {padding:8px} .divFrame .divContent .clsShow {font-size:16px;} .btn {border:#666 1px solid;color:white;padding:5px;width:100px;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fff,EndColorStr=#ece9d8);} </style> <script src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript"> var xmlhttp = null; function CreateXMLHTTP() { if (window.ActiveXObject) { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } else{ if(window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); } else{ alert("初始化XMLHTTP错误!"); } } } function GetSendData() { document.getElementById("divTip").innerHTML="<img alt='' title='loading...' src='./loading.gif' />"; var strSendUrl = "userInfo.html?date="+Date(); CreateXMLHTTP(); xmlhttp.onreadystatechange = function(){ if(xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById("divTip").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET",strSendUrl,true); xmlhttp.send(); } </script></head><body><div class="divFrame"> <div class="divTitle"> <input id="Button1" type="button" onclick="GetSendData()" class="btn" value="获取数据"/> </div> <div class="divContent"> <div id="divTip"></div> </div></div> </body></html>--><!--<html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>load()实现AJAX</title> <style> body {font-size:20px;color:#048bcc;} .divFrame {width:260px;border:solid 1px #666} .divFrame .divTitle {padding:5px;background-color:#eee} .divFrame .divContent {padding:8px} .divFrame .divContent .clsShow {font-size:16px;} .btn {border:#666 1px solid;color:white;padding:5px;width:100px;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fff,EndColorStr=#ece9d8);} </style> <script src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript"> $(function(){ $("#Button1").click(function(){ $("#divTip").load("userInfo.html"); }) }) </script></head><body><div class="divFrame"> <div class="divTitle"> <input id="Button1" type="button" class="btn" value="获取数据"/> </div> <div class="divContent"> <div id="divTip"></div> </div></div> </body></html>--><!--<html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>getJSON()函数获取数据</title> <style> body {font-size:20px;color:#048bcc;} .divFrame {width:260px;border:solid 1px #666} .divFrame .divTitle {padding:5px;background-color:#eee} .divFrame .divContent {padding:8px} .divFrame .divContent .clsShow {font-size:16px;} .btn {border:#666 1px solid;color:white;padding:5px;width:100px;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fff,EndColorStr=#ece9d8);} </style> <script src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript"> $(function(){ $("#Button1").click(function(){ $.getJSON("UserInfo.json",function(data){ $("#divTip").empty(); var strHTML = ""; //遍历获取的数据 $.each(data,function(InfoIndex,Info){ strHTML += " 姓名:" +Info["name"] + "<br />"; strHTML += " 性别:" +Info["sex"] + "<br />"; strHTML += " 邮箱:" +Info["email"] + "<hr />"; }) $("#divTip").html(strHTML); //显示处理后的数据 }); }) }) </script></head><body><div class="divFrame"> <div class="divTitle"> <input id="Button1" type="button" class="btn" value="获取数据"/> </div> <div class="divContent"> <div id="divTip"></div> </div></div> </body></html>--><!--<html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>getScript()函数获取数据</title> <style> body {font-size:20px;color:#048bcc;} .divFrame {width:260px;border:solid 1px #666} .divFrame .divTitle {padding:5px;background-color:#eee} .divFrame .divContent {padding:8px} .divFrame .divContent .clsShow {font-size:16px;} .btn {border:#666 1px solid;color:white;padding:5px;width:100px;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fff,EndColorStr=#ece9d8);} </style> <script src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript"> $(function(){ $("#Button1").click(function(){ $.getScript("UserInfo.js"); }) }) </script></head><body><div class="divFrame"> <div class="divTitle"> <input id="Button1" type="button" class="btn" value="获取数据"/> </div> <div class="divContent"> <div id="divTip"></div> </div></div> </body></html>--><!--<html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>get()函数获取数据</title> <style> body {font-size:20px;color:#048bcc;} .divFrame {width:260px;border:solid 1px #666} .divFrame .divTitle {padding:5px;background-color:#eee} .divFrame .divContent {padding:8px} .divFrame .divContent .clsShow {font-size:16px;} .btn {border:#666 1px solid;color:white;padding:5px;width:100px;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#fff,EndColorStr=#ece9d8);} </style> <script src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript"> $(function(){ $("#Button1").click(function(){ $.get("UserInfo.xml",function(data){ $("#divTip").empty(); var strHTML = ""; $(data).find("User").each(function(){ $strUser = $(this); strHTML += "姓名:" + $strUser.find("name").text() + "<br />"; strHTML += "性别:" + $strUser.find("sex").text() + "<br />"; strHTML += "邮箱:" + $strUser.find("email").text() + "<hr />"; }) $("#divTip").html(strHTML); }) }) }) </script></head><body><div class="divFrame"> <div class="divTitle"> <input id="Button1" type="button" class="btn" value="获取数据"/> </div> <div class="divContent"> <div id="divTip"></div> </div></div> </body></html>--><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>AJAX POST请求</title> <style> body {font-size:16px;color:#048bcc;} .divFrame {width:500px;border:solid 1px #666} .divFrame .divTitle {padding:5px;background-color:#eee} .divFrame .divContent {padding:5px} .divFrame .divContent .clsShow {font-size:16px;} .btn {border:#666 1px solid;width:80px;} .txt {width:150px;margin-bottom:5px;margin-top:5px;} .selSex{width:60px;} </style> <script src="js/jquery-1.8.3.min.js"></script> <script type="text/javascript"> $(function(){ $("#Button1").click(function(){ var emailval = 0; if($("#checkemail").attr("checked")){ emailval = 1;} else{ emailval = 0;} $.ajax({ type:"POST", url:"UserInfo.php", //登录处理页 dataType:"html", //传送请求数据 data:{name:$("#txtName").val(), sex:$("#selSex").val(), email:emailval}, //登录成功后返回的数据 success:function(data){ //alert(data); $("#divTip").html(data); } }) }) }) </script></head><body><form id="frmUserInfo"><div class="divFrame"> <div class="divTitle"> <span>姓名:<input id="txtName" type="text" class="txt" value=""/></span> <select id="selSex" class="selSex"> <option value="男">男</option> <option value="女">女</option> </select> <input id="checkemail" type="checkbox" class="checkemail" >显示邮箱</input> <input id="Button1" type="button" class="btn" value="请求数据"/> </div> <div class="divContent"> <div id="divTip"></div> </div></div></form> </body></html>
文件5: UserInfo.php
<?php$strName = $_POST["name"];$strSex = $_POST["sex"];$strEmial = $_POST["email"];$strHTML = "<div class=''clsShow>";if($strName == "阿里淘" && $strSex == "男"){ $strHTML .= "<hr />姓名:阿里淘<br />"; $strHTML .= "性别:男<br />"; //$strHTML .= "邮箱:ali_tao@163.com"; if ($strEmial == 1) { $strHTML .= "邮箱:ali_tao@163.com<br />"; } $strHTML .= '<div style="text-align:right;"><input type="button" value="查看Ta的博客" onclick=""></div><hr />';}else if($strName == "李建州" && $strSex == "女"){ $strHTML .= "<hr />姓名:李建州<br />"; $strHTML .= "性别:女<br />"; //$strHTML .= "邮箱:ali_li@163.com"; if ($strEmial == 1) { $strHTML .= "邮箱:ali_li@163.com<br />"; } $strHTML .= '<div style="text-align:right;"><input type="button" value="查看Ta的博客" onclick=""></div><hr />'; }else{ $strHTML .= "<hr />没有你要查询的内容!<hr />";}$strHTML .= "</div>"; echo $strHTML;?>
信息查询界面:
0 0
- html和php编写系统登录和信息查询
- 用html和php实现登录功能
- 查询系统和进程状态信息
- 信息查询系统编写--三层架构
- WMI技术介绍和应用——查询系统信息
- WMI技术介绍和应用——查询系统信息和补丁包信息
- WMI技术介绍和应用——查询系统信息和补丁包信息
- (HTML)这是一篇用HTML语言编写一些的信息,集合了html中一些用法和内容
- PHP 和 HTML
- 【PHPFAQ】PHP 和 HTML
- php和html
- [JAVA]自动抽取用 HTML、XML 和 Java 编写的信息
- 系统数据文件和信息
- 系统数据文件和信息
- 登录查询学生信息
- 用户转换和信息查询
- 实现记录和查看用户的系统登录和退出历史和利用C#编写的网络聊天程序
- php解析和编写xml
- Java进阶(十七)ArrayList与LinkedList的区别
- Django中的原子事务相关注意事项
- 【详解】Python爬虫脚本M9优化
- hdoj Robberies 2955 (概率Dp&&01背包) 好题
- LeetCode 292: Nim Game (Nim游戏)
- html和php编写系统登录和信息查询
- 浅谈C语言的存储区
- 叶子问题
- 关于LaunchImage的警告
- java投票系统
- linux内核Kmalloc分配内存需要注意的问题(GFP_KERNEL可能会造成内核调度错误)
- Qt .ui转换为.h文件
- 图像处理与计算机视觉基础、经典以及最近发展
- Python基础入门(2) - 命令行参数 sys.argv[]用法