jQuery开发之Ajax
1。load()方法
(1)load()方法是jQuery中最经常使用和最简单的Ajax方法,能载入远程HTML代码,并插入代码中。
它的结构为:
load(url [,data] [,callback])
load()方法解释例如以下表所看到的
演示样例代码例如以下:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>jQuery test </title>
<script type ="text/javascript" src ="jquery.js" ></script>
<link href="styles.css" rel="stylesheet" type="text/css" />
<script type ="text/javascript">
$(document).ready(function(){
$("#send").click(function(){
$("#resText").load("test.html");
});
});
</script>
</head>
<body>
<div class ="comment">
<h6>张三:</h6>
<p class ="para">沙发</p>
</div>
<div class ="comment">
<h6>李四:</h6>
<p class ="para">板凳</p>
</div>
<div class ="comment">
<h6>王五:</h6>
<p class ="para">地板</p>
</div>
<input type ="button" id ="send" value ="Ajax获取" />
<div class ="comment">已有评论:</div>
<div id = "resText"></div>
</body>
</html>
执行效果:
没有单击button的时候
单击button后
(2) 筛选载入的html文档
核心代码例如以下:
$("resText").load("test.html .para")
执行效果例如以下:
(3)传递方式
load()方法的传递方式依据data来自己主动指定。假设没有參数传递。则採用 GET方式传递。反之,则採用POST方式。演示样例代码例如以下:
无參数传递是get方法
$("resText").load("test.php",function(){
})
$("resText").load("test.php",{name:"rain",age:"22"},function(){
})
(4) 回调參数
对于必须在载入完毕后再能进行的操作。load()方法提供了回调函数(callback),该函数有三个參数分别代表请求返回的内容,请求状态和XMLHttpRequest对象,jQuery代码例如以下:
$("resText").load("test.php",function(responseText,textStatus,XMLHttpRequest){
//responseText 返回的内容
//textStatus 请求状态 success, error, notmodified,timeout
//XMLHttpRequest对象
})
2。$.get()方法和$.post()方法
$.get()方法使用GET方法进行异步请求。
它的结构为:
$.get(url [,data] [,callback] [,type])
參数解释例如以下:
$.post() 方法演示样例代码例如以下:
3,$.getScript()方法 和$.getJson()方法
(1), 有时候,在页面初次载入时取得所需的所有javaScript()文件是全然没有必要的。尽管能够在须要哪个 JavaScript的时候,动态的创建<script> 标签。jQuery代码例如以下:
$(document.createElement("script")).attr("src","test.js").appendTo("head");
或者
$("<script type ='text/javaScript' src ='test.js'/>").appendTo("head");
用$.getScript() 更加的简单
$.getScript("test.js")
(2) $.getJson()方法
jQuery演示样例代码例如以下:
(4) $.ajax()方法
$.ajax() 方法是jQuery中Ajax的最底层实现。结构为:
$.ajax(options)
參数说明例如以下:
演示样例代码例如以下:
$(function(){
$("send").click(function(){
$.ajax({
type:"GET",
url:"test.js",
dataType:"script"
});
});
})
jQuery中Ajax全局事件还有其它几种。例如以下:
注意:
jQuery开发之Ajax的更多相关文章
- Python开发之AJAX
一.概述 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用:一个简单操作 ...
- Python开发之AJAX全套
概述 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用 一个简单操作需要 ...
- JQuery开发之Galleriffic图片插件介绍
Galleriffic是一个用于创建快速展示相册中照片的jQuery插件.从图一中可以看成,图片既可以以幻灯片的方式查看,也可以手动点击缩略图查看.Galleriffic还支持分页,从而使得它能够展示 ...
- python自动开发之(ajax)第二十天
1.Django请求的生命周期 路由系统 -> 试图函数(获取模板+数据=>渲染) -> 字符串返回给用户 2.路由系统 /index/ -> 函数或类.as_view() / ...
- Django开发之Ajax POST提交403报错
问题现象 Django开发时,前端post提交数据时,由于csrf机制,如果不做处理会报403报错 问题解决 通过在data字段中添加 csrfmiddlewaretoken: '{{ csrf_to ...
- Django开发之Ajax 返回内容报错
预期效果 Django通过Ajax POST提交数据,前台弹窗处理结果 粗略代码 # views.py 代码 ...省略... msg = { 'code': 200, 'message': 'Hel ...
- 转Python开发之AJAX全套
转自:https://www.cnblogs.com/nulige/p/6603415.html#4206261
- JavaEE开发之SpringMVC中的自定义消息转换器与文件上传
上篇博客我们详细的聊了<JavaEE开发之SpringMVC中的静态资源映射及服务器推送技术>,本篇博客依然是JavaEE开发中的内容,我们就来聊一下SpringMVC中的自定义消息转发器 ...
- Liferay7 BPM门户开发之37: Liferay7下的OSGi Hook集成开发
hook开发是Liferay客制扩展的一种方式,比插件灵活,即可以扩展liferay门户,也能对原有特性进行更改,Liferay有许多内置的服务,比如用hook甚至可以覆盖Liferay服务. 可作为 ...
随机推荐
- 详解css媒体查询
简介 媒体查询(Media Queries)早在在css2时代就存在,经过css3的洗礼后变得更加强大bootstrap的响应式特性就是从此而来的. 简单的来讲媒体查询是一种用于修饰css何时起作用的 ...
- R语言基础-data.frame
data.frame比较像表格,每一列是一个向量,即每列中的元素是同一类型:所有列具有相同的长度. x = 10:1 y = -4:5 q = c("Ha","oh&qu ...
- (转)浅谈测试驱动开发(TDD)
测试驱动开发(TDD)是极限编程的重要特点,它以不断的测试推动代码的开发,既简化了代码,又保证了软件质量.本文从开发人员使用的角度,介绍了 TDD 优势.原理.过程.原则.测试技术.Tips 等方面. ...
- H.264编码profile & level控制
背景知识 先科普一下profile&level.(这里讨论最常用的H264) H.264有四种画质级别,分别是baseline, extended, main, high: 1.Baseli ...
- POJ 2486 树形背包DP Apple Tree
设d(u, j, 0)表示在以u为根的子树中至多走k步并且最终返回u,能吃到的最多的苹果. 则有状态转移方程: #include <iostream> #include <cstdi ...
- appium+python自动化-xpath定位
基本属性定位 以淘宝app为例,定位左上角扫一扫按钮 1.可以通过text文本定位到 //*[@text='text文本属性'] # 定位text driver.find_element_by_xpa ...
- A. Light Bulb
A. Light Bulb Time Limit: 1000ms Case Time Limit: 1000ms Memory Limit: 32768KB 64-bit integer IO f ...
- LeetCode--二分查找相关算法
-(1)有一个升序排列的非负数组,要求利用o(logn)的时间复杂度找到数组中确定数字target的第一次出现的位置下标和最后一次出现的位置下标,如果不存在该target返回[-1,-1] 解决方案: ...
- UITableView滑动动画+FPSLabel
主要使用了tableView的代理方法 行将要显示的时候 - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableView ...
- 虚拟机安装centos6.5
最近想搞一下代码覆盖率的jacoco,需要在linux环境下部署一套jenkins.故需要装一个centos的虚拟机. 一.安装虚拟机. 下载后安装一个虚拟机,我选择的是VMware虚拟机 二.安装c ...