首页 > PHP资讯 > HTML5培训技术 > jquery_ajax入门实例

jquery_ajax入门实例

HTML5培训技术

序:本文通过几个小例子,简介如何使用jqueryAjax异步加载。


1. $(selector).load(url,[data],[callback]) :载入远程HTML文件代码并插入DOM中。

url (String) : 请求的HTML页的URL地址。

data (Map) : (可选参数) 发送至服务器的 key/value 数据。

callback (Callback) : (可选参数) 请求完成时(不需要是success的)的回调函数。

这个方法默认使用 GET 方式来传递的,如果[data]参数有传递数据进去,就会自动转换为POST方式的。jQuery 1.2 中,可以指定选择符,来筛选载入的 HTML 文档,DOM 中将仅插入筛选出的 HTML 代码。语法形如 "url #some > selector"。

eg : $(".div1").load(url,[data],[callback])


2.$. get(url,[data],[callback]): 使用GET方式来进行异步请求

url (String) : 发送请求的URL地址.

data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示,会做为QueryString附加到请求URL中。

callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法).


3.$.post(url,[data],[callback]) :使用GET方式来进行异步请求。

参数:

url (String) : 发送请求的URL地址.

data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示。

callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。

type (String) : (可选)官方的说明是:Type of data to be sent。其实应该为客户端请求的类型(JSON,XML,等等)data(Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示。


4.$.ajax(options):通过Http请求加载远程数据 。

这个是jQuery 的底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。

$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该对象,但特殊情况下可用于手动终止请求。

注意: 如果你指定了 dataType 选项,请确保服务器返回正确的 MIME 信息,(如 xml 返回 "text/xml")。错误的 MIME 类型可能导致不可预知的错误。
当设置 datatype 类型为 'script' 的时候,所有的远程(不在同一个域中)POST请求都回转换为GET方式。

$.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息。详细参数选项见下。

jQuery 1.2 中,您可以跨域加载 JSON 数据,使用时需将数据类型设置为 JSONP。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。数据类型设置为 "jsonp" 时,jQuery 将自动调用回调函数。

参数列表:

参数名类型描述
url String(默认: 当前页地址) 发送请求的地址。
typeString(默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分 >


2.Myhtml.jsp

      MyHtml.html	                              This is my HTML page. 

3.test.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>    <%= request.getParameter("name") %>    <%= request.getParameter("pwd") %>


4.hint.jsp

<%@page import="java.io.PrintWriter"%><%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String params = request.getParameter("suggest");if(params==""){	out.write("没有建议词汇");}else{	String[] a ={"alan","afanda","amari","binary","bbk","bank"};	StringBuffer results = new StringBuffer();	for(int i=0 ; i  


5.demo.txt

jQuery and AJAX is FUN!!!

This is some text in a paragraph.









本文由欣才IT学院整理发布,未经许可,禁止转载。