jQuery简单入门(五)
5.Ajax应用
在jQuery中$ajax()方法属于最底层的方法,第二层是load()、$.get()、$.post(),第三层是$.getScript()和 $.getJSON();下面根据使用频率来介绍
1.load()方法
load()方法能载入远程HTML代码并插入DOM中(实际项目中,该方法使用频率高???!!!)
load(url [, data] [,callback])
表现形式:
A. 载入HTML文档
$(“tag”).load(“load.html”);//把load.html加载到tag标签
B. 筛选载入的HTML文档
$(“tag”).load(“load.html .class”);//把load.html文档中类样式为class的内容加载到tag标签
C. 传递方式
$(function() {
$(“tag”).load(“test.php”, function() {
Alert(“无参数传递,则是GET方式”);
}).load(“test.php”, {name : “test”, age : “22”}, function() {
Alert(“有参数传递,则是POST方式”);
});
});
D. 回调参数
$(“tag”).load(“test.php”, {name : “test”, age : “22”}, function(responseText, textStatus, XMLHttpRequest) {
// responseText 请求返回的内容
//textStatus 请求状态
//XMLHttpRequest XHR对象
});
2.$.get()方法和$.post()方法
Get请求限定数据大小为2k,而post原则上是不限定大小
Get数据放入地址栏中,post放入到报文消息体内
- Get()
$.get(url [,data] [,callback] [,type])
Aa. 对返回的HTML数据处理
$(function() {
$(“#submit”).click(function() {
$.get(“test.php”, {
Name : $(“#name”).val(),
Content : $(“#content”).val()
}, function(data, textStatus) {
$(“tag”).html(data);
})
});
});
Ab. XML文档
$(function() {
$(“#submit”).click(function() {
$.get(“test.php”, {
Name : $(“#name”).val(),
Content : $(“#content”).val()
}, function(data, textStatus) {
Var name = $(data).find(“comment”).attr(“name”);
Var content = $(data).find(“comment content”).text();
Var html = “<div class=’comment’><h6>”+
name+“</h6><p class=’para’>” +
content+”</p></div>”;
$(“tag”).html(html);
})
});
});
Ac. JSON文件
$(function() {
$(“#submit”).click(function() {
$.get(“test.php”, {
Name : $(“#name”).val(),
Content : $(“#content”).val()
}, function(data, textStatus) {
Var name = data.name;
Var content = data.content;
Var html = “<div class=’comment’><h6>”+
name+“</h6><p class=’para’>” +
content+”</p></div>”;
$(“tag”).html(html);
})
});
});
2.Post()[参考get()]
3.$.getScript()方法和getJson()方法
A.$.getScript(js [,callback])//动态加载js文件
Aa.动态加载js文件
$.getScript(“test.js”);
Ab.使用回调
$getScript(“jquery.color.js”, function() {
Alert(“使用回调”);
})
B.getJSON(json [,callback])//动态加载json文件,使用方法类似getScript()
4.$.ajax()方法
示例代码:
$.ajax({
Type : GET,
Url : “test.php”,
dataType : “json”,
Success : function (data) {
Alert(“回调成功”);
}
});
5.jQuery中的Ajax全局事件
监控一个异步请求的过程
ajaxStart()
ajaxStop()
(完)
jQuery简单入门(五)的更多相关文章
- jQuery简单入门
jQuery是什么 John Resig在2006年1月发布的一款跨主流浏览器的JavaScript库,简化JavaScript对HTML操作为什么要使用jQuery (1)write less do ...
- jQuery简单入门(三)
3.事件和动画 A. 事件 Aa. DOM加载 1.为什么使用jQuery加载DOM方法? 以javascript的window.onload()方法加载DOM的先决条件是:必须等待被请求页面的资源全 ...
- jQuery简单入门(二)
2.Dom操作 A.DOM分类 个人认为在jQuery中这些分类被弱化了,有兴趣的读者可以自行补充这方面的知识: aa.DOM Core bb.HTML -DOM cc. CSS-DOM B.jQue ...
- jQuery简单入门(四)
4.表单应用 表单是HTML的重要组成部分,在采集.提交用户输入的信息和显示列表数据等需求中有重要作用 表单应用 一个简单的表单HTML示例: <form action=”url” method ...
- jquery简单入门(一)
相关: 本文参考<锋利的jQuery第二版> 写在前面: jQuery作为javascript框架,是做网页交互工作者,一个值得学习的优秀的前端框架... 百度指数分析:(http://i ...
- jquery简单入门1
前端 html:展示 form: 属性: action和method 子标签: input(10种) text password radio checkbox file submit button r ...
- jquery 简单入门
例:GridView
- HTML5简单入门系列(五)
前言 本篇将讲述HTML5的服务器发送事件(server-sent event) Server-Sent 事件 Server-Sent 事件是单向消息传递,指的是网页自动获取来自服务器的更新. 以前的 ...
- 从零开始学习jQuery (一) 入门篇
本系列文章导航 从零开始学习jQuery (一) 入门篇 一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案, 即使你会使用jQuery也能在阅读中发现些 ...
随机推荐
- cros解决跨域
- [调整] Firemonkey TEdit 避免按下立即弹出键盘的问题
目前 Firemonkey 有一个问题,就是在 Edit 按下会立即弹出键盘,在红鱼儿的博客也提交了 QC: http://blog.sina.com.cn/s/blog_44fa172f0102vy ...
- .net下mysql存储过程返回自定义值(原创)
ado.net方法 public static string ExecuteQueryProc(string sConnStr, string sSql, Hashtable args) { MySq ...
- Scalaz(30)- Free :Natural Tranformation ~> - map higher kinded types for free
当我们需要定义一些对应高阶类型进行相互类型转换的操作函数时,我们发现scala语言并不提供能定义这种函数的支持.举例来说:如果我们希望定义一个函数把对于任何T值的Option[T]转换成List[T] ...
- Cookie——Javascript
基本的cookie操作有三种:读取.写入.删除. var CookieUtil = { //根据cookie的name获取相应的value.它会在document.cookie字符串中查找cookie ...
- BaseActivity的抽取
Activity有些公共部分,比如setContentView.Activity管理.初始化操作.联网操作.Activity跳转.关闭当前Activity.保存用户登录信息.读取用户登录信息等. 我们 ...
- spring的使用《一》
在前边的文章中说明了,如何搭建一个spring的开发环境,简单回顾下就是把spring的jar包导入工程中,如果是在javaWeb项目中是放在lib目录下,然后在web.xml文件中进行配置,配置sp ...
- 把Java生成的RSA公钥、私钥转换成.NET使用的XML格式
import java.security.KeyFactory; import java.security.interfaces.RSAPrivateCrtKey; import java.secur ...
- WPF的ComboBox 数据模板自定义
WPF的ComboBox 有些时候不能满足用户需求,需要对数据内容和样式进行自定义,下面就简要介绍一下用数据模板(DataTemplate)的方式对ComboBox 内容进行定制: 原型设计如下: 步 ...
- HTML5拖放(drag and drop)与plupload的懒人上传
HTML5拖放能够将本地的文件拖放到页面上,plupload又是很好的文件上传插件,而今天就将两者结合,做了个文件拖拽上传的功能. 简述HTML5拖放 拖放是HTML5标准的一部分,任何元素都能够拖放 ...