如何用ajax编写登录页面
这次给大家带来如何用ajax编写登录页面,用ajax编写登录页面的注意事项有哪些,下面就是实战案例,一起来看一下。
AJAX的全称是Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。
ajax的优点:
1、最大的一点是页面无刷新,用户的体验非常好。
2、使用异步方式与服务器通信,具有更加迅速的响应能力。
3、可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。并且减轻服务器的负担,ajax的原则是“按需取数据”,可以最大程度的减少冗余请求,和响应对服务器造成的负担。
4、基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。
5、ajax可使因特网应用程序更小、更快,更友好。
这里我用ajax写一个简单的登录页面:首先用到的是数据库login的表:
下面是登录页面的代码,首先要引入jquery包
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script src="jquery-3.1.1.min.js"></script> /*引入jquery包*/ </head> <body> <h2>登录页面</h2> <p>用户名:<input type="text" id="uid"/></p> <p>密码:<input type="text" id="pwd"/></p> <p><input type="button" id="btn"value="登录"/></p>11</body>12</html>
登录页面很简单,就不上图了,之前的博客也写过很多次了
然后下面就是ajax的写法了。
<script type="text/javascript"> $("#btn").click(function(){ //第一步:取数据,这里用到了用户名和密码 var uid=$("#uid").val(); var pwd=$("#pwd").val(); //第二步:验证数据,这里需要从数据库调数据,我们就用到了ajax $.ajax({ url:"dlchuli.php",//请求地址 data:{uid:uid,pwd:pwd},//提交的数据 type:"POST",//提交的方式 dataType:"TEXT", //返回类型 TEXT字符串 JSON XML success:function(data){ //开始之前要去空格,用trim() if(data.trim()=="OK") { window.location.href = "main.php"; } else{ alert("用户名或者密码错误"); } } }) }) </script>
dlchuli.php的代码写法如下:
<?php include("DADB.class.php"); $db=new DADB(); $uid=$_POST["uid"]; $pwd=$_POST["pwd"]; $sql="select password from login where username='{$uid}'"; $arr=$db->Query($sql); if($arr[0][0]=$pwd && !empty($pwd)) { echo"OK"; } else{ echo"NO"; } ?>
写到这里,用ajax写的简单的登录页面就完成了,最大的好处就是如果出错会在原来的页面报错,不会蹦到其他的页面。
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
以上是如何用ajax编写登录页面的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

当你在自己电脑上登过别人steam账号之后,恰巧这个别人的账号也有wallpaper软件,切换回自己账号之后steam就会自动下载别人账号订阅的壁纸,用户可以通过关闭steam云同步解决。wallpaperengine登录别的号后下载别人的壁纸怎么办1、登陆你自己的steam账号,在设置里面找到云同步,关闭steam云同步。2、登陆你之前登陆的别人的steam账号,打开wallpaper创意工坊,找到订阅内容,然后取消全部订阅。(以后防止找不到壁纸,可以先收藏再取消订阅)3、切换回自己的stea

随着社交媒体的迅速发展,小红书已经成为许多年轻人分享生活、探索新产品的热门平台。在使用过程中,有时用户可能会遇到登录以前账号的困难。本文将详细探讨如何解决小红书登录旧账号的问题,以及如何应对更换绑定后可能遗失原账号的情况。一、小红书怎么登录以前的账号?1.找回密码登录如果长时间未登录小红书,可能导致账号被系统回收。为了恢复访问权限,你可以尝试通过找回密码的方式重新登录账号。操作步骤如下:(1)打开小红书App或官网,点击“登录”按钮。(2)选择“找回密码”。(3)输入你注册账号时所使用的手机号码

Discuz后台登录问题解决方法大揭秘,需要具体代码示例随着互联网的快速发展,网站建设变得越来越普遍,而Discuz作为一款常用的论坛建站系统,受到了许多站长的青睐。然而,正是因为其功能强大,有时候我们在使用Discuz的过程中会遇到一些问题,比如后台登录问题。今天,我们就来大揭秘Discuz后台登录问题的解决方法,并且提供具体的代码示例,希望能帮助到有需要

近日有一些小伙伴咨询小编快手电脑版怎么登录?下面就为大家带来了快手电脑版的登录方法,有需要的小伙伴可以来了解了解哦。第一步:首先在电脑的浏览器上百度搜索快手官网。第二步:在搜索结果列表里面选取第一条。第三步:进入到快手官网主页面后,点击视频的选项。第四步:点击右上角的用户头像。第五步:在弹出的登录菜单里面点击二维码登录。第六步:之后打开手机上的快手,点击左上角的图标。第七步:点击二维码标志。第八步:在我的二维码界面点击右上角的扫描图标之后,扫描电脑上的二维码即可。第九步:最后电脑版的快手就登录成

小红书如今已经融入了许多人的日常生活,其丰富的内容和便捷的操作方式让用户乐此不疲。有时候,我们可能会忘记账号密码,只记得账号而无法登录确实让人感到困扰。一、小红书只记得账号怎么登录?当忘记密码时,我们可以通过手机验证码的方式登录小红书。具体操作如下:1.打开小红书App或网页版小红书;2.点击“登录”按钮,选择“账号密码登录”;3.点击“忘记密码?”按钮;4.输入你的账号,点击“下一步”;5.系统会发送验证码到你的手机,输入验证码后点击“确定”;6.设置新的密码并确认。你还可以通过第三方账号(如

谷歌浏览器无法登录账号怎么办?很多用户在使用这款软件的时候,某些功能需要用户们登录谷歌账号才可以使用,但是尝试了很多次,都没有登录成功,面对这个问题,不少用户都不知道应该如何解决,那么本期小编就来和各位分享解决方法,希望今日的软件教程内容可以给大伙带来帮助。 解决方法如下: 1、点击桌面一个浏览器,打开之后看到这个样子。 2、此时如果弹出登录,点击它,如看不到的点击右上角。 3、点击登录,然后输入你的账号,账号不用输入@之后的一节,点击下一步。 4、输入密码,看到这个提示,点击启用

百度网盘不仅能储存各种软件资源,还能分享给别人,支持多端同步,如果你的电脑没有下载客户端,可以选择进入网页版使用。那么百度网盘网页版怎么登入呢?下面就来看看详细介绍。 百度网盘网页版登录入口:https://pan.baidu.com(复制链接到浏览器打开) 软件介绍 1、分享 提供文件分享功能,用户将文件整理,分享给需要的小伙伴。 2、云端 不占用太多内存,大多数文件都保存在云端,有效节省电脑空间。 3、相册 支持云相册功能,将照片导入到云盘中,然后整理,方便大家查看。

如何解决Laravel登录时间失效的常见问题在使用Laravel开发Web应用程序时,登录认证是一个非常重要的功能。然而,有时候用户登录后长时间不操作,页面可能会自动退出登录或者认证失效。这个问题较为常见,下面将介绍如何通过设置session的时间来解决这个问题,并提供具体的代码示例。1.设置session的过期时间在Laravel中,默认情况下sessi
