jquery是一个优秀的js框架，自然对js原生的ajax进行了封装，

封装后的ajax的操作方法更简洁，功能更强大，与ajax操作

相关的jquery方法有如下几种：

Ajax 请求

但开发中    经常使用的有三种：

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技术的更多相关文章

  1. JS原生Ajax&Jquery的Ajax技术&Json

    1.介绍Ajax Ajax = 异步 JavaScript 和 XML Ajax是一种创建快速动态网页的技术 通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新.这意味着可以不用整个 ...

  2. 实现简单的PHP接口，以及使用js/jquery ajax技术调用此接口

    主要介绍下如何编写简单的php接口,以及使用js/jquery的ajax技术调用此接口. Php接口文件(check.php): <?php $jsonp_supporter = $_GET[‘ ...

  3. 前端技术Jquery与Ajax使用总结

    前端技术Jquery与Ajax使用总结 虽然主要是做的后端,但是由于有些时候也要写写前台的界面,因此也就学习了下Jquery和Ajax的一些知识,虽说此次写的这些对于前端大神来说有些班门弄斧的感觉,但 ...

  4. 使用Jquery的Ajax实现无刷新更新，修改，删除页面

    本文将向大家讲述一下最近工作的一些总结,主要包括了以下内容,注册界面以及详细信息界面的编辑.主要是介绍了AJAX技术,因为我觉得其他方面没什么好介绍的.首先是跟大家说一下Ajax的优点,假如你删除了一 ...

  5. 对jquery的ajax进行二次封装

    第一种方法: $(function(){ /** * ajax封装 * url 发送请求的地址 * data 发送到服务器的数据,数组存储,如:{"username": " ...

  6. 关于Jquery中ajax介绍

    jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该函数,除非你需 ...

  7. jquery之ajax

    语法: $.ajax(url,[settings])/jQuery.ajax(url,[settings]) 返回值:XMLHttpRequest (该函数属于全局jQuery对象(也可理解为静态函数 ...

  8. 原生态AJAX详解和jquery对AJAX的封装

    AJAX: A :Asynchronous [eI`sinkrenes] 异步 J :JavaScript    JavaScript脚本语言 A: And X :XML 可扩展标记语言 AJAX现在 ...

  9. 触碰jQuery：AJAX异步详解

    触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...

随机推荐

  1. 前端入门17-JavaScript进阶之作用域

    声明 本系列文章内容全部梳理自以下几个来源: <JavaScript权威指南> MDN web docs Github:smyhvae/web Github:goddyZhao/Trans ...

  2. 华为防火墙USG6000V使用总结

    问题1.ge 1/0/0 的ip地址 20.0.0.2 ,从直连的对端20.0.0.1 无法ping. 但是从防火墙ping对端却是可以ping通? 原因: 华为新一代的防火墙,默认情况下,只有0口是 ...

  3. Linux内核高端内存

    Linux内核地址映射模型 x86 CPU采用了段页式地址映射模型.进程代码中的地址为逻辑地址,经过段页式地址映射后,才真正访问物理内存. 段页式机制如下图. Linux内核地址空间划分 通常32位L ...

  4. spring boot 中使用 jpa以及jpa介绍

    1.什么是jpa呢?JPA顾名思义就是Java Persistence API的意思,是JDK 5.0注解或XML描述对象-关系表的映射关系,并将运行期的实体对象持久化到数据库中.12.jpa具有什么 ...

  5. "'cl' 不是内部或外部命令，也不是可运行的程序"解决方案

    最近使用VS2012+Qt5.1+QtCreator2.8.1来搭建Qt的开发环境(之前有用MinGW编译的经历,经常碰到gdb调试器崩溃的问题),全部换成想用VC的编译器和调试环境,但是觉得QtCr ...

  6. jest 自动化测试

    概述 jest 是 facebook 开源的,用来进行单元测试的框架,可以测试 javascipt 和 react. 单元测试各种好处已经被说烂了,这里就不多扯了.重点要说的是,使用 jest, 可以 ...

  7. Python简单的多线程demo：常用写法

    简单多线程实现:启动50个线程,并计算执行时间. import threading import time def run(n): time.sleep(3) print("task:&qu ...

  8. Vue SSR: 基本用法 （二）

    上一篇讲解了ssr的原理,这篇主要讲基本用法: 1.安装 npm install vue vue-server-renderer --save 我们将在整个指南中使用 NPM,但你也可以使用 Yarn ...

  9. web开发-Django博客系统

    项目界面图片预览 项目代码github地址 项目完整流程 项目流程: 1 搞清楚需求(产品经理) (1) 基于用户认证组件和Ajax实现登录验证(图片验证码) (2) 基于forms组件和Ajax实现 ...

  10. xcrun: error: unable to find utility "PackageApplication", not a developer tool or in PATH ​

    xcrun: error: unable to find utility "PackageApplication", not a developer tool or in PATH ...