在JQuery中,AJAX有三种实现方式:$.ajax() , $.post , $.get()。 
首先我们看$.get():

.代码如下:
$.get("test.jsp", 
{ name: "cssrain", time: "2008/01/21" }, //要传递的数据 
function(data){ 
alert("返回的数据: " + data); 

然后看$.post(): 
跟$.get()格式一样.

.代码如下:
$.post("test.jsp", 
{ name: "cssrain", time: "2008/01/21" }, //要传递的数据 
function(data){ 
alert("返回的数据: " + data); 

上面2种方式的区别应该就是 请求方式不同(一个get 一个post). 
最后我们看$.ajax():

.代码如下:
$.ajax({ 
url:'Accept.jsp', 
type:'post', //数据发送方式 
dataType:'html', //接受数据格式 (这里有很多,常用的有html,xml,js,json) 
data:'text='+$("#name").val()+'&date='+new Date(), //要传递的数据 
error: function(){ //失败 
alert('Error loading document'); 
}, 
success: function(msg){ //成功 
alert( "Data Saved: " + msg ); 

}); 

实例 
前台jsp部分的代码如下:... 
票数:

.代码如下:
<span id="i<%=id%>"><%=vote_number%></span><br/> 
<a onclick=myvote(<%=id%>); href='javascript:;'">投票</a> 

... 
js部分的代码如下

.代码如下:
function myvote(id){ 
$.post("vote.jsp", { id: id }, 
function(data){ 
eval("var data="+data); 
if (data.issucc=="0"){ 
alert(data.mess) 
}else{ 
//alert("更新页面"); 
$("#i"+data.myid).html(data.votenum); 

}); 

返回数据为json 
后台返回的json数据如下 
{issucc:,mess:”“,votenum:,myid:} 
issucc:是否成功 
mess:信息,主要是错误信息,比如没登录,超过限制等 
votenum:投票后的得票总数 
myid:投票的id,用于更新页面的投票数 
一个注册登录实例 
js 
login.jsp返回的类型为text形式,正确时是“OK”,错误时是 
“error”。

.代码如下:
var userName; 
var password; 
var result; 
$(document).ready(function(){ 
$("#load").hide(); 
$("#success").hide(); 
$("#error").hide(); 
}); 
$(document).ready(function(){ 
$("#button").click(function(){ 
$("#error").hide(); 
$("#load").show("slow"); 
userName = $("#userName").val(); 
password = $("#password").val(); 
$.ajax({type: "post", 
url: "login.jsp", 
dataType: "html", 
data: "userName="+userName+"&password="+password, 
success: function(result){ 
var res = String($.trim(result)); 
if(res=="OK"){ 
$("#myTable").hide("slow"); 
$("#success").show("slow"); 
}else if(res=="error"){ 
$("#error").show("slow"); 
$("#load").hide("slow"); 
}else{ 
alert("返回异常");} 

}); 
}); 
}); 

jsp页面 
第一种responseText格式

.代码如下:
<%@ page language="java" pageEncoding="gb2312"%> 
<% 
String userName = request.getParameter("userName"); 
String password = request.getParameter("password"); 
if(password.equals("longleg")&&userName.equals("thy")){ 
out.print("OK"); 
}else{out.print("error");} 
%> 

jquery的ajax实现方式的更多相关文章

  1. 使用jquery通过AJAX请求方式,后台返回了当前整个HTML页面代码

    该结果分为多种情况: 1.当前项目使用了interceptor/filter,拦截或者过滤了特定请求. 2.在HTML页面使用了表单提交,没有对表单的“onsubmit”事件做return false ...

  2. Spring MVC ajax提交方式

    使用jquery的ajax的方式来提交 第一种,以json对象的形式提交 var jsonData = { "name" : "zhangsan", " ...

  3. Jquery通过Ajax方式来提交Form表单

    今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({ type: "POST", url: ...

  4. jQuery中ajax的4种常用请求方式

    jQuery中ajax的4种常用请求方式: 1.$.ajax()返回其创建的 XMLHttpRequest 对象. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数 ...

  5. jquery ajax请求方式与提示用户正在处理请稍等,等待数据返回时loading的显示

    1.jquery ajax请求方式与提示用户正在处理请稍等 为了提高用户体验度,我们通常会给出 “正在处理,请稍等!”诸如此类的提示.我们可通过设置$.ajax()下的参数beforeSend()来实 ...

  6. 通过XMLHttpRequest和jQuery实现ajax的几种方式

    AJAX大家已经都知道了,是为了实现异步通讯,提高用户体验度,而将很多旧知识(XML,DOM,JavaScript,HTML,Jquery,Css……)重新融合的一个新的知识框架.而,XMLHttpR ...

  7. jquery的ajax和原始的ajax这两种方式的使用方法

    jquery的ajax是对原始的ajax进行的封装,方便用户的使用.下面用代码分别举例各自的使用方式. jquery的ajax发送和接收xml数据格式. $.ajax({ type: "PU ...

  8. 今天在研究jquery用ajax提交form表单中得数据时,学习到了一种新的提交方式

    今天在研究jquery用ajax提交form表单中得数据时,学习到了一种新的提交方式 jquery中的serialize() 方法 该方法通过序列化表单值,创建 URL 编码文本字符串 序列化的值可在 ...

  9. Jquery发送ajax请求以及datatype参数为text/JSON方式

    Jquery发送ajax请求以及datatype参数为text/JSON方式 1.方式一:datatype:'text' 2.方式二:datatype:'JSON' 3.使用gson-1.5.jar包 ...

随机推荐

  1. JavaScript之DOM查询

    DOM查询 - 通过具体的元素节点来查询 - 元素.getElementsByTagName() - 通过标签名查询当前元素的指定后代元素,返回数组 - 元素.childNodes - 获取当前元素的 ...

  2. Ubuntu14.04安装opencv2.4.13

    本文参考相关链接:http://blog.csdn.net/honyniu/article/details/46390097   系 统:Ubuntu 14.04 x64 opencv版本:2.4.1 ...

  3. 10+ Best Responsive HTML5 AngularJS Templates

    http://www.responsivemiracle.com/collective/best-responsive-html5-angularjs-templates/

  4. 【转】谈谈 iOS 中图片的解压缩

    转自:http://blog.leichunfeng.com/blog/2017/02/20/talking-about-the-decompression-of-the-image-in-ios/ ...

  5. OpenCV代码提取: threshold函数的实现

    threshold algorithm: The simplest image segmentation method. All thresholding algorithms take a sour ...

  6. RHCE7认证学习笔记17——KickStart安装系统

    一.自动化安装系统工具 1.Cobbler    另一个自动化安装工具: 2.Kickstart 二.使用kickstart自动化安装系统 服务器安装的软件: 1.dhcp服务   [root@lin ...

  7. Django学习笔记(一):环境安装与简单实例

    Django学习笔记(一):环境安装与简单实例 通过本文章实现: Django在Windows中的环境安装 Django项目的建立并编写简单的网页,显示欢迎语与当前时间 一.环境安装 结合版本兼容性等 ...

  8. Linux-获得命令帮助man

    date:显示当前系统时间,修改时间 clock,hwclock:显示硬件时间 cal:calendar,查看日历 计时器靠晶体振荡器来完成计时 Linux: 实时时钟,rtc,real time c ...

  9. #Spring实战第二章学习笔记————装配Bean

    Spring实战第二章学习笔记----装配Bean 创建应用对象之间协作关系的行为通常称为装配(wiring).这也是依赖注入(DI)的本质. Spring配置的可选方案 当描述bean如何被装配时, ...

  10. 梳理 Opengl ES 3.0 (一)宏观着眼

    Opengl ES 可以理解为是在嵌入式设备上工作的一层用于处理图形显示的软件,是Opengl 的缩水版本. 下图是它的工作流程示意图: 注意图中手机左边的EGL Layer Opengl ES是跨平 ...