js进阶 14-4 $.get()方法和$.post()方法如何使用

一、总结

一句话总结：$.get（URL,callback); $.post(URL,data,callback); callback函数和load()方法里面的callback一样。

1、load方法和$.get()以及$.post()方法的区别是什么（load也可以实现ajax的post和get请求）？

load方法是局部变量，前面需要加上监听对象，监听对象就是返回结果放置的元素
$.get()以及$.post()时全局方法，不必加上监听对象

20             // $('#test').load('test.php?password=1234560')
40                   $.get('testGet.php',{password:'123456'},function(responseTxt,statusTxt){

41                       // alert(responseTxt)

42                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

43                   })

2、$.get()提交数据四种方法？

a、url中?接参数

b、字符串（jquery1.3之后支持）

c、json对象

20                   //get方式提交数据1

21               /*

22                   $.get('test.html',function(data,statusTxt){

23                       alert(data)

24                       alert(statusTxt)

25                   })

26

27                   //get方式提交数据2

28                   $.get('testGet.php?password=123456',function(responseTxt,statusTxt){

29                       // alert(responseTxt)

30                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

31                   })

32

33                //get方式提交数据3

34                   $.get('testGet.php','password=123456',function(responseTxt,statusTxt){

35                       // alert(responseTxt)

36                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

37                   })

38

39                    //get方式提交数据4

40                   $.get('testGet.php',{password:'123456'},function(responseTxt,statusTxt){

41                       // alert(responseTxt)

42                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

43                   })

44

45                //post方式提交数据1

46                   $.post('testPost.php',{password:'123456'},function(responseTxt,statusTxt){

47                       // alert(responseTxt)

48                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

49                   })

二、$.get()方法和$.post()方法如何使用

1、相关知识

get()和post()方法

两种在客户端和服务器端进行请求-响应的常用方法是：GET和POST.
GET基本上用于从服务器获得（取回）数据。注释：GET方法可能返回缓存数据。
POST也可用于从服务器获取数据。不过，POST方法不会缓存数据，并且常用于连同请求一起发送数据。

  • $.get（URL,callback);

    参数

    1. 第一个参数是我们希望请求的URL;
    2. 第二个参数是回调函数。第一个回调参数存有被请求页面的内容，第二个回调参数存有请求的状态。
  • $.post(URL,data,callback);

    参数

    1. 必需的URL参数规定您希望请求的URL。
    2. 可选的data参数规定连同请求发送的数据
    3. 可选的callback参数是请求成功后所执行的函数名。第一个回调参数存有被请求页面的内容，而第二个参数存有请求的状态
    4. type：返回内容格式,xml,html,script,json,text,_default。
 

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>

 <body>

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

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

 <script type="text/javascript">

 $(function(){

         $(function(){

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

                   //get方式提交数据1

               /*

                   $.get('test.html',function(data,statusTxt){

                       alert(data)

                       alert(statusTxt)

                   })    

                   //get方式提交数据2

                   $.get('testGet.php?password=123456',function(responseTxt,statusTxt){

                       // alert(responseTxt)

                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

                   })

                //get方式提交数据3

                   $.get('testGet.php','password=123456',function(responseTxt,statusTxt){

                       // alert(responseTxt)

                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

                   })

                    //get方式提交数据4

                   $.get('testGet.php',{password:'123456'},function(responseTxt,statusTxt){

                       // alert(responseTxt)

                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

                   })

                //post方式提交数据1

                   $.post('testPost.php',{password:'123456'},function(responseTxt,statusTxt){

                       // alert(responseTxt)

                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

                   })

                */

    //post方式提交数据2

               $.post('testPost.php','password=123456',function(responseTxt,statusTxt){

                       // alert(responseTxt)

                       $('#test').html('responseTxt:'+responseTxt+'<br/>'+'status: '+statusTxt)

                   })

         })

     })

 })

 </script>

 </body>

 </html>

php（post请求和get请求）

get

 <?php

     //get方式提交数据

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

         echo "登陆成功";

     }else{

         echo "密码错误";

     }

 ?>

post

 <?php

     // //post方式提交数据

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

         echo "登陆成功";

     }else{

         echo "密码错误";

     }

 ?>
 

js进阶 14-4 $.get()方法和$.post()方法如何使用的更多相关文章

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

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

  2. js进阶 11-18 jquery中操作选择器的方法有哪些

    js进阶 11-18 jquery中操作选择器的方法有哪些 一.总结 一句话总结:add().addBack().end() 1.add()方法是干嘛的,举一例? 将add()方法后选择器选择的jqu ...

  3. Node.js进阶：5分钟入门非对称加密方法

    前言 刚回答了SegmentFault上一个兄弟提的问题<非对称解密出错>.这个属于Node.js在安全上的应用,遇到同样问题的人应该不少,基于回答的问题,这里简单总结下. 非对称加密的理 ...

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

    js进阶 14-2 如何用ajax验证登陆状态(这里用load方法) 一.总结 一句话总结:$('#test').load('test.php?password=1234560'),这样就get方式提 ...

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

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

  6. js进阶 14-5 $.getScript()和$.getJSON()方法的作用是什么

    js进阶 14-5 $.getScript()和$.getJSON()方法的作用是什么 一.总结 一句话总结:$.getScript()和$.getJSON()方法专门用来加载JS/JSON文件(远程 ...

  7. js进阶 14-1 jquery的ajax系列中的load方法的作用是什么

    js进阶 14-1 jquery的ajax系列中的load方法的作用是什么 一.总结 一句话总结:jQuery load()方法作用是从服务器加载数据,是一个简单但强大的AJAX方法. 1.load函 ...

  8. js进阶 12-13 jquery中one方法和trigger方法如何使用

    js进阶 12-13 jquery中one方法和trigger方法如何使用 一.总结 一句话总结: 1.one()方法和on()方法的区别是什么? 除了one()只执行一次,其它和on()一模一样,包 ...

  9. js进阶课程 12-9 jquery的事件对象event的方法有哪些？

    js进阶课程 12-9 jquery的事件对象event的方法有哪些? 一.总结 一句话总结:三组六个,阻止默认事件一组,阻止冒泡一组,阻止冒泡和剩余事件一组. 1.事件的默认动作指什么? 比如点a标 ...

随机推荐

  1. IDEA下使用maven的mybatis错误—XXXDao is not known to the MapperRegistry

    # IDEA下使用maven的mybatis常见错误(二) 错误类型二:mybatis.xml注册映射文件错误 错误提示:Type interface com.aynu.dao.CountryDao ...

  2. Mysql学习总结（7）——MySql索引原理与使用大全

    一.索引介绍 索引是对数据库表中一列或多列的值进行排序的一种结构.在关系数据库中,索引是一种与表有关的数据库结构,它可以使对应于表的SQL语句执行得更快.索引的作用相当于图书的目录,可以根据目录中的页 ...

  3. 洛谷——P1155 双栈排序

    题目描述 Tom最近在研究一个有趣的排序问题.如图所示,通过2个栈S1和S2,Tom希望借助以下4种操作实现将输入序列升序排序. 操作a 如果输入序列不为空,将第一个元素压入栈S1 操作b 如果栈S1 ...

  4. Windows7下修改pip源

    以下列举三种方式的pip源配置: 1. 设置环境变量PIP_CONFIG_FILE指向pip.ini源配置文件,pip.ini文件内容如下: [global] index-url = http://m ...

  5. Codeforces 164 D Minimum Diameter

    题目链接~~> 做题感悟:越来越感觉CF的题非常好,非常有深度. 解题思路: 这题须要注意 k 的大小.由于 k 仅仅有 30 个,终于形成的点的直径一定是某个确定的值,所以我们能够枚举这个值. ...

  6. eclipse部署maven web项目到tomcat服务器时，没有将lib、web.xml复制过去的解决办法

    我这几天在写项目的时候发现自己以前的项目能够访问,隔一段时间写的这个项目却不能够访问,没有发现代码的逻辑错,但是就是访问不了jsp页面,项目一发布就是出现404错误,后来发现原来是发布到tomcat上 ...

  7. js---10时间类

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

  8. Python 数据结构与算法 —— 哈弗曼树

    1. 从扩充二叉树到哈弗曼树 扩充二叉树:对二叉树 T,加入足够多的新叶节点(而不是任意),使 T 的原有结点都变成度数为 2 的分支节点,得到的二叉树称为 T 的扩充二叉树. 对于扩充二叉树而言, ...

  9. JS面向对象系列教程 — 对象的基本操作

    面向对象概述  面向对象(Object Oriented)简称OO,它是一种编程思维,用于指导我们如何应对各种复杂的开发场景. 这里说的对象(Object),意思就是事物,在面向对象的思维中,它将一 ...

  10. Java反射之getInterfaces()方法

    今天学习Spring3框架,在理解模拟实现Spring Ioc容器的时候遇到了getInterfaces()方法.getInterfaces()方法和Java的反射机制有关.它能够获得这个对象所实现的 ...