用ajax技术编写login登陆界面

最新推荐文章于 2021-08-05 13:17:51 发布

aozeahj

最新推荐文章于 2021-08-05 13:17:51 发布

阅读量4.9k

点赞数 1

分类专栏： php网站开发

本文链接：https://blog.csdn.net/aozeahj/article/details/50856191

版权

这篇博客介绍了如何使用Ajax技术创建一个登录界面，包括图片点击触发提交、异步验证和数据库验证用户账户密码。博客详细讲解了HTML、CSS、JavaScript和PHP的实现代码，以及Ajax的异步请求过程。

摘要由CSDN通过智能技术生成

</pre></div>      一开始跟老师学习，老师就要求写一个login界面，当时暗地里一想这也太简单了吧！但当老师一说要用到什么技术..... 。我一下子就惊呆了，原来小小的登陆界面也需要有这么多的技术去支持。</h1><div> <span style="font-size:24px">从易到难，我决定先不做很花俏的界面，先做的有技术了，目标两点：1.图片点击事件触发提交；2.在登陆界面上进行异步检测；3.数据库账户密码验证。</span></div><div><span style="font-size:24px"></span></div><div><span style="font-size:24px">先上登陆界面的代码</span></div><div><span style="font-size:24px"></span><pre name="code" class="css" style="font-size: 24px; font-weight: bold;">div.login
{

border: 1px  solid  #a0b1c4  ;
height:429px;
width:300px;
position: absolute;
left:1200px;
top: 150px;
 
}

<span style="font-size:24px;"></pre><pre name="code" class="php"><span style="font-size:24px;"><!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=utf-8 " />
<link rel="stylesheet" href="/loginProject/css/div.css" type=