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

 <!DOCTYPE html>

 <html lang="en">

 <style>

 </style>

 <head>

     <meta charset="UTF-8">

     <title>演示文档</title>

     <script type="text/javascript" src="jquery-3.1.1.min.js"></script>

     <style type="text/css">

       </style>

 </style>

 </head>

     <input type="button" id="btn" value="Ajax测试">

     <div id="test"></div>

 <body>

 <script type="text/javascript">

     $(function(){

         $('#btn').click(function(){

               //get方式提交数据

             // $('#test').load('test.php?password=1234560')

               //post方式提交数据

             $('#test').load('test.php',{

                 password:'1234560'

             })

         })

     })

 </script>

 </body>

 </html>

php

 <?php

     /*

     //echo "51自学网";

     //get方式提交数据

     if ($_GET['password']=='123456') {

         echo "登陆成功";

     }else{

         echo "密码错误";

     }

     */

     //post方式提交数据

     if ($_POST['password']=='123456') {

         echo "登陆成功";

     }else{

         echo "密码错误";

     }

 ?>
 

js进阶 14-2 如何用ajax验证登陆状态（这里用load方法）的更多相关文章

  1. js进阶 14 jquery的ajax有哪些函数和事件（多练）

    js进阶 14 jquery的ajax有哪些函数和事件(多练) 一.总结 一句话总结:常用:load.ajax.post.get.getScript().getJSON().表单序列化,ajax事件这 ...

  2. 【 D3.js 进阶系列 — 1.2 】 读取 CSV 文件时乱码的解决方法

    在 D3 中使用 d3.csv 读取 CSV 文件时,有时会出现乱码问题. 怎么解决呢? 1. 乱码问题 使用 d3.csv 读取 xxx.csv 文件时.假设 xxx.csv 文件使用的是 UTF- ...

  3. js进阶正则表达式14验证邮编（input的pattern属性）（正则表达式加起^始$）

    js进阶正则表达式14验证邮编(input的pattern属性)(正则表达式加起^始$) 一.总结 1.input的pattern属性:里面可以直接放正则表达式,<input type=&quo ...

  4. JS表单验证插件(支持Ajax验证)

    自己编写了一个表单验证插件,支持ajax验证,使用起来很简单. 每个需要验证的表单元素下面有一个span标签,这个标签的class有一个valid表示需要验证,如果有nullable则表示可为空:ru ...

  5. Js表单验证控件-02 Ajax验证

    在<Js表单验证控件(使用方便,无需编码)-01使用说明>中,写了Verify.js验证控件的基本用法,基本可以满足大多数验证需求,如果涉及服务端的验证,则可以通过Ajax. Ajax验证 ...

  6. 14.ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  7. js进阶 14-9 ajax事件有哪些

    js进阶 14-9 ajax事件有哪些 一.总结 一句话总结:ajax开始时事件.发送时事件,请求完成时事件,请求成功时事件,请求结束时事件,请求错误时事件事件. 1.ajax事件的监听对象是谁? 都 ...

  8. js进阶 14-7 jquery的ajax部分为什么需要对表单进行序列化

    js进阶 14-7 jquery的ajax部分为什么需要对表单进行序列化 一.总结 一句话总结:如果用ajax传递表单的数据,如果不进行表单的序列化,要一个参数一个参数的写,太麻烦,序列化的话,一句代 ...

  9. js进阶 14-6 $.ajax()方法如何使用

    js进阶 14-6 $.ajax()方法如何使用 一.总结 一句话总结:$.ajax([settings])settings可选.用于配置Ajax请求的键值对集合. 1.$.ajax()的特点是什么( ...

随机推荐

  1. jmind-redis一个redis的nio客户端

    Redis是一个基于key/value的系统.Redis目前最新版本是2.2.4,用着很不错,不过java版本的客户端比较的不给力,目前redis 客户端jedis 是基于io 的socket . 而 ...

  2. 数据库范式小结 1NF 2NF BCNF 3NF 4NF DB normal form

    1. 1NF指关系中的每个变量不可再分 2. 2NF指消除了非主属性对码(candidate key)的部分依赖的1NF 比如(S#,C#)-> SN ,(S#,C#)-> SD .S#- ...

  3. Redis学习手冊(事务)

    一.概述:       和众多其他数据库一样,Redis作为NoSQL数据库也相同提供了事务机制. 在Redis中,MULTI/EXEC/DISCARD/WATCH这四个命令是我们实现事务的基石. 相 ...

  4. js---05 自定义属性

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  5. elasticsearch index之Translog

    跟大多数分布式系统一样,es也通过临时写入写操作来保证数据安全.因为lucene索引过程中,数据会首先据缓存在内存中直到达到一个量(文档数或是占用空间大小)才会写入到磁盘.这就会带来一个风险,如果在写 ...

  6. Autoencoders and Sparsity（二）

    In this problem set, you will implement the sparse autoencoder algorithm, and show how it discovers ...

  7. 【习题 8-14 UVA - 1616】Caravan Robbers

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 二分长度. 显然长度越长.就越不可能. 二分的时候.可以不用管精度. 直接指定一个二分次数的上限就好. 判断长度是否可行.直接用贪心 ...

  8. [Redux-Observable && Unit Testing] Use tests to verify updates to the Redux store (rxjs scheduler)

    In certain situations, you care more about the final state of the redux store than you do about the ...

  9. [Android] 图像各种处理系列文章合集

        这是我近期在做Android随手拍一个项目的各种网上关于图片处理的资料,曾经学过数字图像处理都是用C++写的,以下的资料个人觉得是很优秀的各种集合,还有一方面它是在线笔记,希望对大家有所帮助吧 ...

  10. c++操作当前窗体句柄

    句柄 这一概念是MFC里的一个类.MFC有专门的函数来获取窗体句柄. HWND hwnd; hwnd=CreateWindow("my own windowshandle",&qu ...