微信扫一扫打赏支持

js进阶 14-2 如何用ajax验证登陆状态（这里用load方法）

js进阶 14-2 如何用ajax验证登陆状态（这里用load方法）

打赏

 

一、总结

一句话总结：$('#test').load('test.php?password=1234560')，这样就get方式提交了密码。

 

1、load函数的三个参数分别是什么？

都有一个参数是方法完成时的执行函数，第二个参数是传递到后台的数据，第一个参数是url

.load()从服务器加载数据，然后把返回到HTML放入匹配元素。

语法：load(url,data,function(response,status,xhr))

1.必需的URL参数规定您希望加载的URL。

2.可选的data参数规定与请求一同发送的查询字符串键/值对集合。

3.可选的callback参数是load()方法完成后所执行的函数名称

 

 

2、load方法如何post方式提交数据？

用load的第二个参数

22             $('#test').load('test.php',{
23                 password:'1234560'
24             })
11     //post方式提交数据
12     if ($_POST['password']=='123456') {
13         echo "登陆成功";
14     }else{
15         echo "密码错误";
16     }

 

 

二、如何用ajax验证登陆状态（这里用load方法）

1、相关知识

load()方法

jQuery load()方法作用是从服务器加载数据，是一个简单但强大的AJAX方法。

  • .load()从服务器加载数据，然后把返回到HTML放入匹配元素。

    语法：load(url,data,function(response,status,xhr))

    1.必需的URL参数规定您希望加载的URL。

    2.可选的data参数规定与请求一同发送的查询字符串键/值对集合。

    3.可选的callback参数是load()方法完成后所执行的函数名称

  • 回调函数参数含义

    1. responseTxt-包含调用成功时的结果内容

    2. statusTXT-包含调用的状态：可能是"success"、"notmodifide"、"error"、'timeout"、"abort"或"parsererror"中的一个，最长见的是：succes成功;error错误

    3. Xhr-经过jQuery封装的XMLHttpRequest对象（保留其本身的所有属性和方法）

 

 

2、代码

html

复制代码
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <style>
 4 </style>
 5 <head>
 6     <meta charset="UTF-8">
 7     <title>演示文档</title>
 8     <script type="text/javascript" src="jquery-3.1.1.min.js"></script>
 9     <style type="text/css">
10       </style>
11 </style>
12 </head>
13     <input type="button" id="btn" value="Ajax测试">
14     <div id="test"></div>
15 <body>
16 <script type="text/javascript">
17     $(function(){
18         $('#btn').click(function(){
19               //get方式提交数据
20             // $('#test').load('test.php?password=1234560')
21               //post方式提交数据
22             $('#test').load('test.php',{
23                 password:'1234560'
24             })
25         })
26     })
27 </script>
28 </body>
29 </html>
复制代码

php

复制代码
 1 <?php
 2     /*
 3     //echo "51自学网";
 4     //get方式提交数据
 5     if ($_GET['password']=='123456') {
 6         echo "登陆成功";
 7     }else{
 8         echo "密码错误";
 9     }
10     */
11     //post方式提交数据
12     if ($_POST['password']=='123456') {
13         echo "登陆成功";
14     }else{
15         echo "密码错误";
16     }
17 ?>
复制代码

 

 

 

 

 
posted @   范仁义  阅读(801)  评论(0)  编辑  收藏  举报
编辑推荐：
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
阅读排行：
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗？
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句：使用策略模式优化代码结构
· AI与.NET技术实操系列（六）：基于图像分类模型对图像进行分类
历史上的今天：
2017-07-20 L2-002. 链表去重
2017-07-20 L2-003. 月饼
侧边栏
打赏
点击右上角即可分享
微信分享提示
SQL AI 助手