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. 【Linux下tar命令详解】

    tar命令用于建立.还原备份文件,它可以加入.解开备份文件内的文件. 参数 带有*号的为常用的参数 . -A 新增压缩文件到已存在的压缩包 . -c 建立新的压缩文件* . -d 记录文件的差别 . ...

  2. react基础用法二(组件渲染)

    react基础用法二(组件渲染) 如图所示组件可以是函数 格式:function 方法名(){ return <标签>内容</标签>} 渲染格式: <方法名 />  ...

  3. 【福利】微信小程序130个精选Demo合集

    小编最近在开发小程序,也读到了不少优秀的小程序源码,项目中有些需求可以直接从源码里粘贴复制过来,虽然这样做不利于自己独立编写代码,但比较是给公司做项目啊,秉着效率第一的原则,简直没有什么比ctrl+c ...

  4. Codeforces Beta Round #2 C. Commentator problem

    模拟退火果然是一个非常高端的东西,思路神马的全然搞不懂啊~ 题目大意: 给出三个圆,求一点到这三个圆的两切线的夹角相等. 解题思路: 对于这个题来说还是有多种思路的 .只是都搞不明确~~   /害羞脸 ...

  5. Python命令行參数大全

      -b     :    当转换数组为字符串时提出警告.比方str(bytes_instance), str(bytearray_instance). -B     :    当导入.py[co]文 ...

  6. vue -- config index.js 配置文件详解

    此文章介绍vue-cli脚手架config目录下index.js配置文件 此配置文件是用来定义开发环境和生产环境中所需要的参数 关于注释 当涉及到较复杂的解释我将通过标识的方式(如(1))将解释写到单 ...

  7. 项目: 更新(二) python 实现大概FTP的功能

    服务器利用 socketserver 模块 构造, 实现了 多进程. 客户端仍然利用的是底层的 socket模块. 只不过进行了更深度的 解耦, 新加或者删除 某些功能 更方便 在上一个版本的基础上, ...

  8. Kinect 开发 —— 保持视频影像

    相比直接将影像显示出来,如果能将录制到的影像保存到硬盘上就好了.但是,影像录制,是需要一定的技巧,在网上可以看到很多例子演示如何将Kinect获取到的影像以图片的形式保存到本地,前面的博文也介绍了这一 ...

  9. CF 843 A. Sorting by Subsequences

    A. Sorting by Subsequences You are given a sequence a1, a2, ..., an consisting of different integers ...

  10. Gym 100952 F. Contestants Ranking

    http://codeforces.com/gym/100952/problem/F F. Contestants Ranking time limit per test 1 second memor ...