jQuery 中ajax异步调用的四种方式


Posted in Javascript onJune 28, 2016
<script type="text/javascript" language="javascript" src="JS/jquery-1[1].2.3.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){  //Jquery 页面加载事件,当页面加载之后首先执行这个方法
  
  //第一种Ajax请求
  $.ajax({
    type:"GET",    //请求类型,有get,post等类型,和表单提交是一样的
    url:"Result.aspx", //请求处理的页面,就是说由那个页面捕获请求,同样这个路径可以换成ashx,一般处理程序
    data: "name=John&location=Boston", //传递参数,实在就是(Result.aspx?name=John&loaciton=Boston)
    success:function(msg){ //请求成功会由这个方法处理,其中请求成功返回值由msg接收
      $("#ajaxDIV").text(msg);
    }
  });
  
  
  //第二种请求
  $.get(               //用get请求方式,其实就是上一种的变体
    "Handler.ashx",   
    {name:"笨笨熊",sex:"女"}, //要传递的参数,解析为(Handler.ashx?name=笨笨熊&sex=女)
    function(msg){       //请求返回参数
      $("#Div1").text(msg);
    }
  );
  
  //第三种请求
  $.post(               //这种请求的上一种是一样的,只是请求方式不同
    "Handler2.ashx",
    {name:"benben 笨笨熊",sex:"女"},
    function(msg){
      $("#Div2").text(msg);
    }
  );
  
  
  //第四种请求
  $.getJSON(             //这种是用JSON 实现的,JSON是一种通用的数据格式
    "Handler3.ashx",  //路径
    {name:"aaa"},   //传递参数
    function (data){  //回调处理函数 返回的就是json数据格式,由data接收这串数据
      var str="";     //下面就是解析这些数据,具体接送的使用但不做考虑,设计内容很多,一时无法讲解
      str+="姓名:  "+data.name+"<br/>";
      str+="性别:  "+data.sex+"<br/>";
      str+="地址:  "+data.address+"<br/>";
      $("#Div3").html(str);
    }
  );
});
</script>

以上就是本文的全部内容,了解更多jQuery的语法,大家可以查看:《jQuery 1.10.3 在线手册》,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ASP.NET jQuery 实例13 原创jQuery文本框字符限制插件-TextArea Counter
Feb 03 Javascript
jquery使用jquery.zclip插件复制对象的实例教程
Dec 04 Javascript
JavaScript onkeypress事件入门实例(按下或按住一个键盘按键)
Oct 17 Javascript
深入分析javascript中console命令
Aug 14 Javascript
正则表达式基本语法及表单验证操作详解【基于JS】
Apr 07 Javascript
jQuery 控制文本框自动缩小字体填充
Jun 16 jQuery
angularjs select 赋值 ng-options配置方法
Feb 28 Javascript
React SSR样式及SEO的实践
Oct 22 Javascript
vue之debounce属性被移除及处理详解
Nov 13 Javascript
Webpack设置环境变量的一些误区详解
Dec 19 Javascript
vue路由分文件拆分管理详解
Aug 13 Javascript
vue自定义插件封装,实现简易的elementUi的Message和MessageBox的示例
Nov 20 Vue.js
jQuery 调用WebService 实例讲解
Jun 28 #Javascript
关于在Servelet中如何获取当前时间的操作方法
Jun 28 #Javascript
关于JS 预解释的相关理解
Jun 28 #Javascript
checkbox批量选中,获取选中项的值的简单实例
Jun 28 #Javascript
浅谈js中的in-for循环
Jun 28 #Javascript
BootStrap初学者对弹出框和进度条的使用感觉
Jun 27 #Javascript
Jquery和BigFileUpload实现大文件上传及进度条显示
Jun 27 #Javascript
You might like
PhpMyAdmin中无法导入sql文件的解决办法
2010/01/08 PHP
利用PHP生成静态HTML文档的原理
2012/10/29 PHP
PHP在innodb引擎下快速代建全文搜索功能简明教程【基于xunsearch】
2016/10/14 PHP
用javascript做拖动布局的思路
2008/05/31 Javascript
javascript 写类方式之八
2009/07/05 Javascript
使用apply方法实现javascript中的对象继承
2013/12/16 Javascript
js实现登陆遮罩效果的方法
2015/07/28 Javascript
基于javascript实现随机颜色变化效果
2016/01/14 Javascript
JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
2016/06/14 Javascript
浅析如何利用angular结合translate为项目实现国际化
2016/12/08 Javascript
jquery.tableSort.js表格排序插件使用方法详解
2020/08/12 Javascript
jquery横向纵向鼠标滚轮全屏切换
2017/02/27 Javascript
ionic2打包android时gradle无法下载的解决方法
2017/04/05 Javascript
vue子父组件通信的实现代码
2017/07/09 Javascript
iscroll动态加载数据完美解决方法
2017/07/18 Javascript
详解PHP后期静态绑定分析与应用
2018/03/21 Javascript
JavaScript学习笔记之DOM基础操作实例小结
2019/01/09 Javascript
微信小程序实现的一键复制功能示例
2019/04/24 Javascript
JavaScript实现飞舞的泡泡效果
2020/02/07 Javascript
python批量制作雷达图的实现方法
2016/07/26 Python
在Django model中设置多个字段联合唯一约束的实例
2019/07/17 Python
Django框架配置mysql数据库实现过程
2020/04/22 Python
使用pyplot.matshow()函数添加绘图标题
2020/06/16 Python
碧欧泉Biotherm加拿大官方网站:法国高端护肤品牌
2019/10/18 全球购物
Paper Cape官网:美国婴儿和儿童服装品牌
2019/11/02 全球购物
娇韵诗俄罗斯官方网站:Clarins俄罗斯
2020/10/03 全球购物
美国家居装饰购物网站:Amanda Lindroth
2020/03/25 全球购物
德国亚马逊官方网站:Amazon.de
2020/11/15 全球购物
struct和class的区别
2015/11/20 面试题
教学实验楼管理制度
2014/02/01 职场文书
考试保密承诺书
2014/08/30 职场文书
庆祝三八妇女节标语
2014/10/09 职场文书
vue实现水波涟漪效果的点击反馈指令
2021/05/31 Vue.js
springboot如何接收application/x-www-form-urlencoded类型的请求
2021/11/02 Java/Android
Unicode中的CJK(中日韩统一表意文字)字符小结
2021/12/06 HTML / CSS
SpringBoot接入钉钉自定义机器人预警通知
2022/07/15 Java/Android