【前言】

用Sublime开发时,推荐下载一个jQuery插件,可以智能化创建基本函数格式,支持自动生成,可以提高开发效率

(1)jQuery里ajax方法有几个?

答:有4个,分别为post、get、ajax、getJson(解决跨域时使用)

用来发送ajax请求的常用前3个get、post、ajax,下面依次介绍下

(2)$.get方法

语法:jQuery.get(url,[callback],[type])或者$.get(url,[callback],[type])----------------由此看出jQuery == $,为什么呢?下面再解释下

参数说明:url必须参数,表示请求的url地址;

callback可选参数,表示请求成功后触发的回调函数;

type可选参数,期望的返回数据类型,例如json、text、html、xml、jsonb等。常用的是json,因为格式方便,而且PHP封装了json内置函数

$.get('/path/to/file', function(data) {
/*optional stuff to do after success */
});

拓展:为什么jQuery == $,这要看下jQuery源码了。分析源码后即可找到下面这行

(3)$.post

语法:jquery.post(url,[data],[callback],[type])或者$.post(url,[data],[callback],[type])

参数:url必选,表示请求的url地址;

data可选,表示给url传递的post参数;--------------------为什么get方法没有data参数呢?因为get方法中的参数直接写在url里通过?的形式传递

callback:表示执行成功后的回调函数;

type:期望的返回数据类型

$.$.post('/path/to/file', {param1: 'value1'}, function(data, textStatus, xhr) {
/*optional stuff to do after success */
});

(4)$.ajax方法

该方法是针对上面两个方法的底层实现,即Ajax方法是jQuery里ajax方法(get和post)的底层实现方法

语法:$.ajax(json对象)

参数:就一个参数,即json格式参数

分析代码格式可以发现就一个json格式的参数,下面是JSON对象中的属性说明,下面拓展里介绍下常见属性

      {
url: '/path/to/file',
type: 'default GET (Other values: POST)',
dataType: 'default: Intelligent Guess (Other values: xml, json, script, or html)',
data: {param1: 'value1'},
}

完整$.ajax结构代码:

$.$.ajax({
url: '/path/to/file',
type: 'default GET (Other values: POST)',
dataType: 'default: Intelligent Guess (Other values: xml, json, script, or html)',
data: {param1: 'value1'},
})
.done(function() {
console.log("success");
})
.fail(function() {
console.log("error");
})
.always(function() {
console.log("complete");
});

(4.1)ajax的json参数的属性说明

常见属性:async、cache、complete、data、dataType、success、type、url

①async:ajax全称为Asynchronous Javascript And XML------异步 JavaScript 和 XML,所以该属性表示是否是异步,默认是。

对此有个问题,什么是同步,什么是异步?下面拓展里做下介绍

②cache:是否使用缓存,默认是。当dataType为jsonp或者script的时候默认否,即不使用缓存

③complete(完成):当请求执行完成时触发的回调函数,注意:完成不一定表示成功,当状态码为200时才是成功

④data:表示传递的参数,参数为json格式

⑤dataType:期望的返回数据类型,有json、xml、jsonp、html、text等

⑥success:请求出成功后触发的回调函数

⑦type:请求类型,如get、post

⑧url:请求的地址

拓展:什么是同步?什么是异步?

同步就是顺序执行,异步就是可以并发。举个简单例子,你在家吃饭的时候有人敲门,如果先做完当前动作在执行下一步就是同步执行,即吃完饭再去开门。如果在没有做完当前事的情况下去做下一件事,即你先放下碗去开门,然后回来再吃,这种便是异步。

ThinkPHP---拓展之jQuery的ajax的更多相关文章

  1. Thinkphp,Jquery,Ajax异步发布

    1.在提交表单的HTML页面的<head>中定义一个变量供Jquery使用 <script type='text/javascript'>var handleUrl='< ...

  2. 【原创经验分享】JQuery(Ajax)调用WCF服务

    最近在学习这个WCF,由于刚开始学 不久,发现网上的一些WCF教程都比较简单,感觉功能跟WebService没什么特别大的区别,但是看网上的介绍,就说WCF比WebService牛逼多少多少,反正我刚 ...

  3. jQuery结合Ajax实现简单的前端验证和服务端查询

    上篇文章写了简单的前端验证由传统的JavaScript转向流畅的jQuery滑动验证,现在拓展一下,使用Ajax实现用户体验比较好的异步查询,同样还是从建立一个简单的表单开始 <form nam ...

  4. ThinkPHP页面跳转、Ajax技巧详细介绍(十八)

    原文:ThinkPHP页面跳转.Ajax技巧详细介绍(十八) ThinkPHP页面跳转.Ajax技巧详细介绍 一.页面跳转 $this->success('查询成功',U('User/test' ...

  5. 跨域问题及jQuery中Ajax传参的讲解

    1.跨域:不再同一服务器下,就是协议,域名,端口,有一个不一样: 浏览器对于javascript的同源策略的限制: 案例: 以 http://172.164.23:8088/ 为例 相同域名:172. ...

  6. jQuery之ajax实现篇

    jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...

  7. jQuery版AJAX简易封装

    开发过程中,AJAX的应用应该说非常频繁,当然,jQuery的AJAX函数已经非常好用,但是小编还是稍微整理下,方便不同需求下,可以简化输入参数,下面是实例代码: $(function(){ /** ...

  8. JS原生ajax与Jquery插件ajax深入学习

    序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...

  9. 重写jquery的ajax方法

    //首先备份下jquery的ajax方法 var _ajax=$.ajax; //重写jquery的ajax方法 $.ajax=function(opt){ //备份opt中error和success ...

随机推荐

  1. 以太网接口TCP/IP协议介绍,说的很容易懂了

      以太网接口TCP/IP协议介绍,说的很容易懂了  TCP/IP协议,或称为TCP/IP协议栈,或互联网协议系列. TCP/IP协议栈(按TCP/IP参考模型划分) 应用层 FTP SMTP HTT ...

  2. HQL 查询数据 (获取页面输入的查询条件字段)

    /* * 查询提取位置表所有数据 * */ public String ListEtlExtractPositionOfAll(){ // 接受数据库中传送的code int code = Integ ...

  3. 对于系统盘升级windows10怕空间不够,还是打算继续卸载一些软件

    本来是打算从其他盘压缩,然后扩展,可是怕把磁盘给弄坏了,然后就保存原来的,就是看升级的推送什么时候来了.

  4. [Shell学习笔记] read命令从键盘或文件中获取标准输入(转载)

    转自:http://www.1987.name/151.html read命令是用于从终端或者文件中读取输入的内部命令,read命令读取整行输入,每行末尾的换行符不被读入.在read命令后面,如果没有 ...

  5. 【FFmpeg】FFmpeg常用基本命令(转载)

    转自:http://www.cnblogs.com/dwdxdy/p/3240167.html 1.分离视频音频流 ffmpeg -i input_file -vcodec copy -an outp ...

  6. E20180115-hm

    auxiliary  adj. 辅助的; 备用的,补充的; 附加的; 副的;                n. 助动词; 辅助者,辅助人员; 附属机构,附属团体; 辅助设备;  departure  ...

  7. BEM --Yandex的CSS 命名方法论

    人们问我最多的问题之一是在CSS类名中--和__是什么意思?它们的出现是源于BEM和Nicolas Gallagher... BEM的意思就是块(block).元素(element).修饰符(modi ...

  8. Linux day01(二)虚拟机快照和克隆的用法介绍

    一:快照 优点:运行虚拟机后不用担心系统会被弄崩溃了,点击快照会立即恢复到初始状态 缺点:回滚会带来数据的丢失,所以要考虑数据恢复的成本和找回数据时进行操作的成本 1. 在导航栏中找虚拟机快照的小图标 ...

  9. php 编译时 报错 configure: error: libXpm.(a|so) not found.

    编译环境 centos7 php 5.4.26 $ yum install libXpm-devel 显示已安装 百度得知 ubuntu虚拟机安装lamp遇到的问题 configure: error: ...

  10. JMeter配置MongoDB

    1.启动JMeter,右键添加->配置文件->MongoDB Source Config. 注意:JMeter 3.0以上版本去掉了此配置项,可以从低版本处拷贝. 2.设置MongoDB配 ...