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 ?>

 

 

 

 

 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值