当我们用javascript写ajax程序写得很“开心”的时候,突然有人告诉你有一种东西叫jquery,它会告诉你不直接和HttpRequest是多么的快乐,同时你再也不需要再烦恼纠结的ajax乱码问题,更幸福的是你的js代码将大大地简化,看完本文,你会发现,ajax,简单的来讲就是一句话的事情。

本文重点是来讲讲jQuery中调用ajax的4种方法:$.get、$.post、$getJSON、$ajax。如果读者没有javascript和jquery的知识,或者没有ajax的概念,那么请先去问问google老大,再来读本文。

1、$.get

$.get()方法使用GET方式来进行异步请求,它的语法结构为:

$.get( url [, data] [, callback] )

解释一下这个函数的各个参数:

url:string类型,ajax请求的地址。

data:可选参数,object类型,发送至服务器的key/value数据会作为QueryString附加到请求URL中。

callback:可选参数,function类型,当ajax返回成功时自动调用该函数。

最后写一个$.get()的实例供大家参考:

1
2
3
4
5
6
7
8
9
10
11
$.get(
    "submit.aspx",{
        id:     '123',
        name:   '青藤园',
    },function(data,state){
        //这里显示从服务器返回的数据
        alert(data);
        //这里显示返回的状态
        alert(state);
    }
)

2、$.post()

$.post()方法使用POST方式来进行异步请求,它的语法结构为:

$.post(url,[data],[callback],[type])

这个方法和$.get()用法差不多,唯独多了一个type参数,那么这里就只介绍type参数吧,其他的参考上面$.get()的。

type:type为请求的数据类型,可以是html,xml,json等类型,如果我们设置这个参数为:json,那么返回的格式则是json格式的,如果没有设置,就和$.get()返回的格式一样,都是字符串的。

最后写一个$.post()的实例供大家参考:

1
2
3
4
5
6
7
8
9
10
11
12
$.post(
    "submit.aspx",{
        id:     '123',
        name:   '青藤园',
    },function(data,state){
        //这里显示从服务器返回的数据
        alert(data);
        //这里显示返回的状态
        alert(state);
    },
    "json"
)

3、$.getJSON()

$.getJSON()是专门为ajax获取json数据而设置的,并且支持跨域调用,其语法的格式为:

getJSON(url,[data],[callback])

url:string类型, 发送请求地址  data :可选参数, 待发送 Key/value 参数 ,同get,post类型的data callback :可选参数,载入成功时回调函数,同get,post类型的callback

JSON是一种理想的数据传输格式,它能够很好的融合与JavaScript或其他宿主语言,并且可以被JS直接使用。使用JSON相比传统的通过 GET、POST直接发送“裸体”数据,在结构上更为合理,也更为安全。至于jQuery的getJSON()函数,只是设置了JSON参数的 ajax()函数的一个简化版本。这个函数也是可以跨域使用的,相比get()、post()有一定优势。另外这个函数可以通过把请求url写 成"myurl?callback=X"这种格式,让程序执行回调函数X。

4、$.ajax()

$.ajax()是jquery中通用的一个ajax封装,其语法的格式为:

$.ajax(options)

其中options是一个object类型,它指明了本次ajax调用的具体参数,这里我把最常用的几个参数附上

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$.ajax({
        url: 'submit.aspx',
        datatype: "json",
        type: 'post',
        success: function (e) {   //成功后回调
            alert(e);
        },
        error: function(e){    //失败后回调
            alert(e);
        },
        beforeSend: function(){  /发送请求前调用,可以放一些"正在加载"之类额话
            alert("正在加载");
        }
})

好了,以上就是jquery实现ajax调用的几种方法,希望对大家有所帮助。

标签: ajax, jquery, get, post, getJSON

随机推荐

  1. 动态查找之二叉树查找 c++实现

    算法思想 二叉搜索树(又称二叉查找树或二叉排序树)BST树 二叉查找树 二叉查找树,也称二叉搜索树,或二叉排序树.其定义也比较简单,要么是一颗空树,要么就是具有如下性质的二叉树: (1)若任意节点的左 ...

  2. PHP系列 | 代码复用trait的构造函数使用

    在ThinkPHP5.1 框架中自己封装了一个 trait 类,每次都在控制器中使用,但是在使用框架自身的验证器类(框架控制器方法)报错 在控制器中使用自定义验证器 $param = $this-&g ...

  3. tp使用ajaxReturn返回二维数组格式的字符串,前台如何获取非乱码

    参考: https://www.cnblogs.com/jiqing9006/p/5000849.html https://blog.csdn.net/zengxiangxuan123456/arti ...

  4. Java基础 awt Graphics2D 生成矩形图片并向内写入字符串

        JDK :OpenJDK-11      OS :CentOS 7.6.1810      IDE :Eclipse 2019‑03 typesetting :Markdown   code ...

  5. (原)关于使用imagemagick将gif叠加到图片或者画布上的方法,以及疑难杂症

    今天因为项目过程中,有一个小需求,需要将一个指定的gif按照指定大小,叠加到画布的指定位置上,本来对于熟悉这块的人,简直就是小菜一碟哈,但本人因为对imagemagick的不熟悉,导致在这个需求上摸索 ...

  6. Java 动态代理与AOP

    动态代理与AOP 代理模式 代理模式给某一个目标对象(target)提供代理对象(proxy),并由代理对象控制对target对象的引用. 模式图: 代理模式中的角色有: 抽象对象角色(Abstrac ...

  7. SQLServer for linux安装

    linux下安装sqlserver数据库有2种办法,第一使用yum镜像安装,第二使用rpm安装包安装 rpm安装地址为:https://packages.microsoft.com/rhel/7/ms ...

  8. vs2017 vs2019 打开cs文件提示无法识别的GUID格式

    总结一句话 no zuo no die. 是我自己在注册表中给vs增加了自动以管理员身份运行,把值给错了,弄成了 ~ RUNASADMIN WIN7RTM, 改成 ~ RUNASADMIN 后OK.还 ...

  9. nginx配置优化提高并发量

    1 nginx配置优化提高并发量 worker_processes 2; 这个按照CPU的核数来决定 2 worker_connections 65535; 这个一般设置65535即可 每个进程允许的 ...

  10. matlab柱状图画法

    %%各时段电量需求 clc close all clear all x = [11000 33000 25000 36000 25000 30000 18000]; tick = {'0-6' '6- ...