jquery ajax例子傳回值詳解

來源:互聯網
上載者:User

在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");}
%>

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.