Ajax Step By Step1

Ajax 最关键的地方，就是实现异步请求、接受响应及执行回调。

jQuery 对 Ajax 做了大量的封装，不需要去考虑浏览器兼容性, 对于封装的方式，jQuery 采用了三层封装：最底层的封装方法为：$.ajax()，而通过这层封装了第二层有三种方法：.load()、$.get()和$.post()，最高层是$.getScript()和$.getJSON()方法。

第一．【.load()方法】

参数的使用step by step（load 有三个（URL +data+callback） + type ）

(1)如果想让 Ajax 异步载入一段 HTML 内容，我们只需要一个 HTML 请求的 url 即可。

 //HTML   展示的页面（我们可见的部分）
<input type="button" value="异步获取数据"/>
<div id="box"></div>

//jQuery$('input').click(function()
{
$('#box').load('test.html'); // test.html 是一个url路径 此时仅仅是载入数据
});

 //test.html 内容
<html>
<head>
<body><div><span>我是异步加载数据时需要的内容，我在另一个界面</span></div>
</body>
</head>
</html>

（2）如果是服务器文件。一般不仅需要载入数据（url），还需要向服务器提交数据，那么我们就可以使用第二个可选参数 data。。向服务器提交数据有两种方式：get 和 post。

（2.1）不传递 data，则默认 get 方式.

 $('input').click(function()
{
$('#box').load('test.php?url=www.ww');})

//get方式接受的服务器端

(2.2)传递 data 用来在服务器端做判断

$('input').click(function()
{
$('#box').load('test.php',
{
url:'www.www'
});
});
//post 方式接受的 服务器端

注：test.php 是和服务器端交互的路径，可更加自己的要求配置。

（3）Ajax 数据载入完毕之后，就能执行回调函数 callback，也就是第三个参数。

回调函数也可以传递三个可选参数：

responseText（请求返回）、

textStatus（请求状态)、

XMLHttpRequest （XMLHttpRequest 对象）。

$('input').click(function()
{ $('#box').load('test.php（和服务器交互的路径）',
{
url:'www.www'
},function(response,status,xhr)//回调函数
{
alert('返回的值为：'+response+'，状态为：'+status +'， 状态是：'+xhr.statusText);//用于调试查看，在页面上打印出来});
});

总结：：：总结：.load()方法有三个参数：：url,data,callback

posted on 2016-12-27 00:34 WFaceBoss 阅读(...) 评论(...) 编辑收藏

转载于:https://www.cnblogs.com/wfaceboss/p/6224453.html

Ajax Step By Step1相关推荐

OpenCV中Mat属性step，step1，elemSize，elemSize1
网上写的太过复杂难以理解,我来简单说一下吧: 1.什么是字节: 字节,符号为B,一个字节由8个2进制组成(1B=8bit),表示的范围为0-255,每一个值表示一个符号. 2. 每个代表的含义:(都是 ...
Ajax step by step
ArcGIS Web ADF开发中较多的使用了GetCallbackEventReference方法,由于本人是AJAX菜鸟,本着从小李子(例子)开始的精神,找到了如下一个例子: (代码源自MIDI大 ...
spring Batch实现数据库大数据量读写
spring Batch实现数据库大数据量读写博客分类: spring springBatchquartz定时调度批处理 1. data-source-context.xml Xml代码 &l ...
Spring Batch_ItemReaders and ItemWriters
2019独角兽企业重金招聘Python工程师标准>>> Spring Batch_ItemReaders and ItemWriters All batch processing c ...
OpenCV实现RGB颜色空间和HSI颜色空间的相互转换
核心的转换公式: RGB-->HSI 截图来自中科院刘定生老师的<数字图像处理与分析>课件. HSI-->RGB 具体的数学公式参照冈萨雷斯版<数字图像处理(第三版)&g ...
【洛谷】【USACO】P1118 数字三角形
题目描述 FJ and his cows enjoy playing a mental game. They write down the numbers from 1 to N (1 <= N ...
poj 1016 Numbers That Count【字符串】
题目大意:给你一个数字串,最大长度80,然后计算里面每个数字出现的次数,按照从小到大的顺序排列成另一个数字串.比如5553141变化后是21 13 14 35(2个1,1个3,1个4,3个5). 如果 ...
2014年百度之星程序设计大赛 - 资格赛 1004 Labyrinth（Dp）
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/sr19930829/article/details/26003869 Labyrinth Time ...
r语言多重共线性_R语言与计量经济学（二）多重共线性
(PS:个人不是经济专业的,这个只是个人的一些兴趣,如果哪里有问题希望指出.) library(ggplot2) library(foreign) data7.1<-read.dta(" ...

Ajax Step By Step1

Ajax Step By Step1相关推荐

最新文章

热门文章