`
1140566087
  • 浏览: 559406 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
博客专栏
2c4ae07c-10c2-3bb0-a106-d91fe0a10f37
c/c++ 入门笔记
浏览量:18541
3161ba8d-c410-3ef9-871c-3e48524c5263
Android 学习笔记
浏览量:314203
Group-logo
J2ME 基础学习课程集
浏览量:18762
A98a97d4-eb03-3faf-af96-c7c28f709feb
Spring 学习过程记录...
浏览量:17583
社区版块
存档分类
最新评论

jQuery 之ajax请求

阅读更多

jQuery.ajax();

0、jQuery AJAX 请求
请求 描述
$(selector).load(url,data,callback) 把远程数据加载到被选的元素中
$.ajax(options) 把远程数据加载到 XMLHttpRequest 对象中
$.get(url,data,callback,type) 使用 HTTP GET 来加载远程数据
$.post(url,data,callback,type) 使用 HTTP POST 来加载远程数据
$.getJSON(url,data,callback) 使用 HTTP GET 来加载远程 JSON 数据
$.getScript(url,callback) 加载并执行远程的 JavaScript 文件

(selector) jQuery 元素选择器语法

(url) 被加载的数据的 URL(地址)

(data) 发送到服务器的数据的键/值对象

(callback) 当数据被加载时,所执行的函数

(type) 被返回的数据的类型 (html,xml,json,jasonp,script,text)

(options) 完整 AJAX 请求的所有键/值对选项

1、回调函数:
说明:如果要处理$.ajax();得到的数据,需要使用回调函数。
beforeSend、 error,dataFilter,success,complete.

* beforeSend :在发送请求之前调用,并且传入了一个XMLHttpRequest作为参数;
* error : 在请求出错时调用,传入XMLHttpRequest对象,描述错误类型的字符串以及一个异常对象;
* dataFilter : 在请求成功之后调用,传入返回的数据以及"dataType"参数的值。
并且必须返回新的数据(可能处理过的),传递给success回调函数。
* success 当请求之后调用。传入返回后的数据,以及包含成功代码的字符串;
* complete 当请求完成之后调用这个函数,无论成功或失败,传入XMLHttpRequest对象,以及一个
包含成功或错误代码的字符串;


2、数据类型:
$.ajax() 函数依赖服务器提供的信息来处理返回的数据;
通过dataType 选项可以指定其他不同数据处理方式;xml,html,json,jsonp,script,text;
注意:text 和html 类型返回的数据不会经过处理;数据仅仅简单的将XMLHttpRequest 的
responseText 或 responseHTML属性传递给success回调函数

3、案例:
//加载并执行一个js文件:
$.ajax({
url:"${pageContext.request.contextPath}/test.js",
type:"post",
dataType:"script"
});


4、保存数据到服务器,成功时显示信息:
$.ajax({
url:'${pageContext.request.contextPath}/MyServlet',
type:'post',
data: 'name=John&location=Boston',
success:function(data)
{
alert(data);
}
});

注意:data的方式传入方式有两种: data: {name:"rencai",password:"123"},

//服务器端
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

response.setContentType("text/html");
response.setCharacterEncoding("UTF-8");
response.setHeader("Cache-Control","no-cache");
PrintWriter out = response.getWriter();
System.out.println(request.getParameter("name"));
out.println("服务器响应了"); //这是服务器的响应要求
out.flush();
out.close();
}


5、载入一个html网页
$.ajax({
url: "test1.html",
cache: false,
success: function(html){
$("#results").append(html);
}
});


分享到:
评论

相关推荐

    Jquery跨域Ajax请求测试

    本示例"Jquery跨域Ajax请求测试"将详细讲解如何利用jQuery实现这一功能。 首先,了解同源策略是理解跨域问题的关键。同源策略是浏览器为了保障用户安全而设定的一项机制,它规定了只有来自同一协议、同一域名和同一...

    为jquery的ajax请求添加超时timeout时间的操作方法

    在现代Web开发中,使用jQuery进行Ajax请求是一种常见的操作。jQuery作为一个广泛使用的JavaScript库,简化了从客户端到服务器的数据交互,而Ajax超时的设置则是保证请求响应时效性的重要手段。当客户端向服务器发送...

    jQuery-ajax-用户名异步请求

    在Web开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理以及Ajax交互。本主题聚焦于jQuery中的Ajax功能,特别是如何利用它进行异步用户名验证。Ajax,即Asynchronous JavaScript and ...

    jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法

    jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Object.success,但后台能够返回数据,原代码如下: var source=[]; $.ajax({ ...

    jQuery中ajax请求后台返回json数据并渲染HTML的方法

    jQuery中的AJAX请求是一种非常常见的前端异步数据交互方式,它的作用是使得页面无需重新加载即可向服务器请求数据,并将数据动态地加载到页面中。JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它...

    一个完整的jquery+ajax传送请求的实例

    本文将深入探讨一个完整的jQuery+AJAX传输请求的实例,旨在帮助开发者理解如何有效地使用这两种技术实现异步数据通信。 首先,jQuery是一个强大的JavaScript库,它为DOM操作、事件处理、动画效果和Ajax交互提供了...

    Java通过jQuery实现ajax异步请求

    综上所述,"Java通过jQuery实现ajax异步请求"的示例工程涵盖了客户端与服务器端的交互流程,包括使用jQuery发起AJAX请求、Java后端处理请求并返回数据,以及数据格式的转换和错误处理。了解并掌握这些知识点,对于...

    Jquery的ajax请求的三个例子(带后台代码)

    ### jQuery的Ajax请求详解与示例 #### 一、引言 随着Web技术的发展,Ajax技术因其无需重新加载整个页面即可动态更新数据的能力而受到广泛欢迎。jQuery作为一款优秀的JavaScript库,极大地简化了Ajax的使用过程,...

    基于jQuery的Ajax聊天室程序

    在本聊天室中,jQuery提供了方便的方法来操作DOM元素,监听用户输入,以及发起Ajax请求。 2. **Ajax**:Ajax的核心是创建XMLHttpRequest对象,用于与服务器进行异步通信。在聊天室中,当用户发送消息时,jQuery的$....

    Asp.Net MVC之jQuery与AJAX操作实例

    1. 发送AJAX请求:jQuery提供了`$.ajax()`方法,可以方便地发起AJAX请求。例如: ```javascript $.ajax({ url: '/Home/GetData', // MVC控制器和动作方法 type: 'GET', dataType: 'json', success: function...

    JQuery发起ajax请求Struts2,并操作JSON数据的例子

    下面将详细讲解这些技术及其在"JQuery发起ajax请求Struts2,并操作JSON数据的例子"中的应用。 **jQuery** 是一个轻量级的JavaScript库,简化了DOM操作、事件处理、动画以及Ajax交互。在这个例子中,jQuery用于发起...

    使用jQuery处理AJAX请求的基础学习教程

    使用jQuery处理AJAX请求,不仅可以简化代码,还能提高开发效率。本教程将从基础知识开始,逐步引导读者深入理解使用jQuery处理AJAX请求的方法和技巧。 首先,我们需要了解jQuery中处理AJAX请求的基本语法。jQuery...

    jquery,ajax的几个小例子

    这可以通过监听第一个下拉框的change事件,然后发送Ajax请求获取新的选项数据,最后更新第二个下拉框。自动补全功能常用于输入框,当用户输入时,后台会返回匹配的建议列表。这通常结合keyup事件和$.ajax()实现,...

    jquery中ajax常用的方法,jQuery ajax框架常用方法总结.docx

    jQuery 是一个功能强大且流行的 JavaScript 库,它提供了许多有用的方法来处理 AJAX 请求。AJAX(Asynchronous JavaScript and XML)是一种创建交互式网页的技术,它允许网页从服务器请求数据,而不需要重新加载整个...

    JQuery实现ajax请求的示例和注意事项

    知识点一:什么是JQuery实现ajax请求? ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个页面的情况下,能够更新部分网页的技术。JQuery是目前最流行的JavaScript库,它封装了AJAX操作,使得开发者...

    Ajax里jQuery的ajax与ssh集成

    这里的`@ResponseBody`注解告诉Spring MVC将返回值直接序列化为HTTP响应体,与jQuery的Ajax请求相匹配。 集成过程中,安全是关键。SSH框架如Spring Security可以提供用户认证和授权服务,确保只有经过身份验证的...

    JQuery+AJAX实现用户名验证

    3. **AJAX请求**:在`validateUsername()`函数中,创建XMLHttpRequest对象或者使用jQuery的`$.ajax()`方法。我们发送一个POST或GET请求到服务器,携带用户名数据。 ```javascript function validateUsername() { ...

    jQuery+Ajax请求本地数据加载商品列表页并跳转详情页的实现方法

    效果: json文件: { books:[ {id:1,imgUrl:images/ly.jpg,price:45.00,title:论语,publish:人民文学出版社,num:303,desc:崇贤馆始置唐代太宗朝。1999年,李克先生及志同道合者复兴其宗旨。...

    jquery,jquery是Ajax的一个框架

    jQuery 是一个广泛使用的 JavaScript 库,它极大地简化了前端开发中的许多任务,尤其是处理 AJAX(Asynchronous JavaScript and XML)请求。AJAX 是一种在不刷新整个网页的情况下,允许部分网页内容异步更新的技术。...

    jquery的ajax方法

    **$.ajax()**是jQuery中最全面的Ajax请求函数,它允许我们自定义各种参数以满足不同的需求。通过这个方法,我们可以设置请求的类型(GET或POST)、URL、数据、回调函数等。例如: ```javascript $.ajax({ type: '...

Global site tag (gtag.js) - Google Analytics