html和php编写系统登录和信息查询

最新推荐文章于 2023-02-10 08:42:52 发布
最新推荐文章于 2023-02-10 08:42:52 发布
阅读量2.2k 收藏 6
点赞数 2
分类专栏： JS CSS HTML PHP
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/eastbird/article/details/49951045
版权
JS 同时被 3 个专栏收录
17 篇文章 0 订阅
订阅专栏
HTML
14 篇文章 0 订阅
订阅专栏
PHP
11 篇文章 0 订阅
订阅专栏 

登录界面源码：
文件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"  οnclick="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" οnclick="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的博客" οnclick=""></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的博客" οnclick=""></div><hr />'; 
}
else
{
    $strHTML .= "<hr />没有你要查询的内容!<hr />";
}
$strHTML .= "</div>"; 
echo $strHTML;
?>

信息查询界面：





eastbird
关注
  • 2
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
用php做的一个简单的系统
04-10
用php做的大作业，可以根据个人需求稍加修改，文档都包含在内，对于初学者来说作为学期末大作业是个不错的选择。
教务信息查询系统.zip
06-10
一个简单的教务查询系统，应用到了html,php,css,数据库的技术，软件使用的是wampserver。可以用来做数据库课设什么的
php成绩查询系统（简单）
03-27
使用XAMPP集成环境（内含Apache+MySQL+PHP），开发工具使用phpstrom，在学习php开发网页时编写的代码，供有需要的朋友下载学习使用。 sql文件夹中为数据库导出文件，请使用MySQL或者SqlServer还原后使用。 （sql文件夹的数据库文件上传错误，请删除这个资源）。
PHP实现简单的学生信息管理系统（web版）
热门推荐
weixin_30270561的博客
08-09 1万+
(∩_∩) 1.概述 学了php的一些基础，包括HTML，php，pdo，mysql操作等，一直都没有将它们有机结合。最近写了一个简单的网页版学生信息管理系统，前台用HTML，脚本用到了JavaScript和PHP，数据库用到了MySQL。麻雀虽小，五脏俱全。算是对这些知识的一次总结吧。 2.源码 工程包括5个php文件： index.php,负责首页展现； m...
php实现页面搜索框查询数据库流程
qq_41570699的博客
09-11 2611
php实现页面搜索框查询数据库流程 仅供本人学习查阅使用，不误人子弟 前端：index.html页面 //隐藏域。监控输入的关键词进行传值到后台 <input type="hidden" name="keyword" value="" id="input-name"/> ... //搜索框 <input type="text" id="search_key" size="30" class="qsbox" placeholder="名称、价格..."> <input t
PHP+excel多用途查询系统 v6.6 手机网页版
11-29
这是个极为简单却非常通用、非常方便的成绩查询系统，通用于几乎所有Excel单二维数据表查询。只需修改 查询条件和顶部、底部文字（非常简单），即可用于几乎所有工资等查询，成
登录页面添加回车和单击登录事件 jQuery.ajax中的 beforeSend:function () 回调函数【日常记录】
m0_62639693的博客
09-09 520
登录页面添加回车和单击登录事件 jQuery.ajax中的 beforeSend:function () 回调函数【日常记录】 回车登录
登录、注册（HTML&PHP）
m0_63318127的博客
03-30 8219
0x1登录login.htmllogin.php文件版数据库版0x2登录成功0x3退出登录0x4注册文件版数据库版。
html+ajax登陆,jQuery+Ajax模拟用户登录功能的实现代码
weixin_33218578的博客
07-14 634
摘要 腾兴网为您分享:jQuery+Ajax模拟用户登录功能的实现代码，钻石星球，篆刻字典，中信金通，易码平台等软件知识，以及电视猫app，河南app，红豆婚恋，xvideos本，电子电路，qq约会，铜川电视台,稀有精英插件，旗帜软件，团购活动策划方案，地铁通，最终幻想13，抚顺市住房公积金管理中心，银行客户经理述职报告，逆水寒科举答题器等软件it资讯，欢迎关注腾兴网。效果图如下所示： 大致流程：...
JQuery最全常用方法指南
for__future_的博客
02-10 5313
语法：父元素jQuery对象.append(新创建的jQuery对象)语法：新创建jQuery对象.appendTo(‘父元素选择器’/父元素jQuery对象)
php+sql成绩查询系统(源码+数据库+论文+答辩PPT).zip
06-10
php+sql成绩查询系统(源码+数据库+论文+答辩PPT)（共36个子文件），供大家参考学习，目录结构： 代码（18个文件） 代码.doc 数据库（15个文件） 演示文稿.ppt 论文主体.doc
PHP查询系统
12-14
1.可以模糊查找，也可以根据特定字段查找。并生成.CSV文件共下载。 2.文本数据库，便于编辑。把EXCEL数据导出为逗号分隔的csv文件，然后把逗号替换为长空格“ ”。再把文件名*.csv改为p.dat放于文件夹D中即可。注意格式，比如用长空格分隔后数据中就不要出现长空格，否则会出现错误。你可以查找最后条数据，看是不是正常，如果不正常请检查数据库或程序。
php+mysql成绩查询系统 信息查询系统
01-09
php+mysql成绩查询系统，简单的系统，在用户验证方面还重装很多不足，仅供初学者学习交流之用，下载好请先导入数据库文件
HTML漂亮的信息系统管理界面
03-22
HTML漂亮的信息系统管理界面； HTML CSS JQuery 信息系统 漂亮界面 UI
Php+Mysql网页版通用查询系统 v201911
08-23
Php+Mysql电脑网页版通用考试成绩查分系统:Linux(Utf-8) 你可以轻松应用于各种成绩查询、工资查询、物业费查询、水电费查询、分班查询、录取查询、考场查询、证书查询等修改不频繁保
基于PHP+HTML的音乐管理系统源码+项目说明.zip
最新发布
07-25
此网站使用后端使用PHP编写，完成与数据库的交互工作; 数据库文件在music文件夹中，其内容爬取自网易云网站，数据库名为music,四张数据表,共计一百万余条记录; 运行Web服务器之后，可以浏览器使用本机域名打开...
RGCMS睿谷信息管理系统-PHP
06-25
RGCMS睿谷内容管理系统是一套开源的建站管理系统，使用PHP语言编写，框架为Thinkphp5.1.+，数据库采用MYSQL数据库。 RGCMS睿谷内容管理系统系统特点： 1、自定义各种栏目模型、功能模型，以便适应各种生产场景，模板...
Movim去中心化的社交平台用PHP和HTML5编写
08-07
Movim - 去中心化的社交平台，用PHP和HTML5编写，基于XMPP标准协议。
php成绩查询系统1（简单）
03-27
使用XAMPP集成环境（内含Apache+MySQL+PHP），开发工具使用phpstrom，在学习php开发网页时编写的代码，供有需要的朋友下载学习使用。 sql文件夹中为数据库导出文件，请使用MySQL或者SqlServer还原后使用。
html+jquery+mysql编写学生信息管理系统
05-20
学生信息管理系统需要涉及到前端界面的设计、后端数据的存储和管理，以及数据的展示和查询等功能。下面简单介绍一下使用HTML、jQuery和MySQL来编写学生信息管理系统的基本流程。 1. 前端界面设计 使用HTML和CSS来...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值