JQuery的Ajax技术
jquery是一个优秀的js框架,自然对js原生的ajax进行了封装,
封装后的ajax的操作方法更简洁,功能更强大,与ajax操作
相关的jquery方法有如下几种:
Ajax 请求
- $.ajax([options])
- load(url, [data], [callback])
- $.get(url, [data], [fn], [type])
- $.getJSON(url, [data], [fn])
- $.getScript(url, [callback])
但开发中 经常使用的有三种:
1)$.get(url, [data], [callback], [type])
2)$.post(url, [data], [callback], [type])
url:代表请求的服务器端地址
data:代表请求服务器端的数据(可以是key=value形式也可以是json格式)
callback:表示服务器端成功响应所触发的函数(只有正常成功返回才执行)
type:表示服务器端返回的数据类型(jquery会根据指定的类型自动类型转换)
常用的返回类型:text、json、html等
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
<script type="text/javascript">
//get异步访问
function fun1() {
$.get("/WEB22/ajaxServlet1", //请求的web端的资源地址
{
"name" : "zhangsan",
"age" : 20
}, //客户端向服务器端发送的数据
function(data) { //载入成功时的回调函数,其中data是服务器返回给客户端的数据
alert(data.name);
}, "json" //[type] 返回内容的格式
);
} //post异步访问
function fun2() {
$.post("/WEB22/ajaxServlet1", //请求的web端的资源地址
{
"name" : "zhangsan",
"age" : 20
}, //客户端向服务器端发送的数据
function(data) { //载入成功时的回调函数,其中data是服务器返回给客户端的数据
alert(data.name);
}, "json" //[type] 返回内容的格式
);
}
</script>
</head> <body>
<input type="button" value="get访问服务器端" onclick="fun1()">
<span id="span1"></span>
<br>
<input type="button" value="post访问服务器端" onclick="fun2()">
<span id="span2"></span>
<br>
</body>
</html>
3)$.ajax( { option1:value1,option2:value2... } ); ---- 以后在掌握
常用的option有如下:
async:是否异步,默认是true代表异步
data:发送到服务器的参数,建议使用json格式
dataType:服务器端返回的数据类型,常用text和json
success:成功响应执行的函数,对应的类型是function类型
type:请求方式,POST/GET
url:请求服务器端地址
function fn3(){
$.ajax({
url:"/WEB22/ajaxServlet2",
async:true,
type:"POST",
data:{"name":"lucy","age":18},
success:function(result){
alert(result);
},
error:function(){
alert("请求失败");
},
dataType:"json"
});
}
JQuery的Ajax技术的更多相关文章
- JS原生Ajax&Jquery的Ajax技术&Json
1.介绍Ajax Ajax = 异步 JavaScript 和 XML Ajax是一种创建快速动态网页的技术 通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新.这意味着可以不用整个 ...
- 实现简单的PHP接口,以及使用js/jquery ajax技术调用此接口
主要介绍下如何编写简单的php接口,以及使用js/jquery的ajax技术调用此接口. Php接口文件(check.php): <?php $jsonp_supporter = $_GET[‘ ...
- 前端技术Jquery与Ajax使用总结
前端技术Jquery与Ajax使用总结 虽然主要是做的后端,但是由于有些时候也要写写前台的界面,因此也就学习了下Jquery和Ajax的一些知识,虽说此次写的这些对于前端大神来说有些班门弄斧的感觉,但 ...
- 使用Jquery的Ajax实现无刷新更新,修改,删除页面
本文将向大家讲述一下最近工作的一些总结,主要包括了以下内容,注册界面以及详细信息界面的编辑.主要是介绍了AJAX技术,因为我觉得其他方面没什么好介绍的.首先是跟大家说一下Ajax的优点,假如你删除了一 ...
- 对jquery的ajax进行二次封装
第一种方法: $(function(){ /** * ajax封装 * url 发送请求的地址 * data 发送到服务器的数据,数组存储,如:{"username": " ...
- 关于Jquery中ajax介绍
jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该函数,除非你需 ...
- jquery之ajax
语法: $.ajax(url,[settings])/jQuery.ajax(url,[settings]) 返回值:XMLHttpRequest (该函数属于全局jQuery对象(也可理解为静态函数 ...
- 原生态AJAX详解和jquery对AJAX的封装
AJAX: A :Asynchronous [eI`sinkrenes] 异步 J :JavaScript JavaScript脚本语言 A: And X :XML 可扩展标记语言 AJAX现在 ...
- 触碰jQuery:AJAX异步详解
触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...
随机推荐
- jsp基础语言-jsp声明
jsp声明的语法格式:<%! 声明代码 %> jsp声明的意义:用来定义在程序中使用到的变量.方法等.最后要以“:”结尾. jsp声明举例: <%! int a=100,b=200; ...
- Burnside引理与Polya定理
感觉这两个东西好鬼畜= = ,考场上出了肯定不会qwq.不过还是学一下吧用来装逼也是极好的 群的定义 与下文知识无关.. 给出一个集合$G = \{a, b, c, \dots \}$和集合上的二元运 ...
- MyEclipse自动补全
打开MyEclipse 6.5,然后"window"→"Preferences". 选择"java",展开,"Editor&quo ...
- 广州.NET微软技术俱乐部提技术问题的正确方式
这是 北京.NET微软技术俱乐部 里一个人问问题的方式, 很赞, 所以希望大家问问题也采用这种方式. 耗时少, 使用12月8日活动上董志强先生介绍的windows 10 Snip&Sketch ...
- 数据库连接不上的原因以及springBoot的ioc无法自动注入
无法自动注入解决了,数据池的连接还有问题: 错误原因1: :数据库用的是Mysql8版本,以前的配置mysql驱动包却是5.1.37版本.只需修改驱动包为8.0.11版本即可. <!-- mys ...
- spark-2.4.0-hadoop2.7-安装部署
1. 主机规划 主机名称 IP地址 操作系统 部署软件 运行进程 备注 mini01 172.16.1.11[内网] 10.0.0.11 [外网] CentOS 7.5 Jdk-8.zookeepe ...
- LeetCode算法题-Sum of Square Numbers(Java实现)
这是悦乐书的第276次更新,第292篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第144题(顺位题号是633).给定一个非负整数c,判断是否存在两个整数a和b,使得a的 ...
- SAP PS 模块,项目、WBS与网络作业概念
项目定义 项目定义是项目的唯一标识.通过项目定义,决定了包含于其中的所有WBS元素的组织结构.计划方法.预算方式以及结算方法等信息.而项目定义中的数据,则主要来源于“项目参数文件”,所以创建项目定义时 ...
- i春秋 百度杯”CTF比赛 十月场 login
出现敏感的信息,然后进行登录 登录成功发现奇怪的show 然后把show放到发包里面试一下 出现了源码,审计代码开始 出flag的条件要user 等于春秋 然后进行login来源于反序列化后的logi ...
- SQLi “百度杯”CTF比赛 九月场
试一下1=1 发下username为空,说明哪里出问题了,是没有注入吗?还是被过滤了?试一下#号的url编码%23 编码后,返回的结果是对的,证明是的,有注入 1=2就返回空了 看了wp,就觉得自己的 ...