Detailed explanation of return value of jquery ajax example-JS Tutorial-php.cn

Detailed explanation of return value of jquery ajax example

巴扎黑

Release： 2017-06-30 14:21:13

Original

1183 people have browsed it

The main difference between $.ajax() and ($.post(), $.get()) is that after a successful callback, the execution of success. $.post(), $.get() can only be simple Pass it and return. .Follow-up work cannot continue. So depending on the situation, call

In JQuery, there are three ways to implement AJAX: $.ajax(), $.post, $.get().
First we look at $.get():

The code is as follows:

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

Copy after login

Then we look at $.post():
The format is the same as $.get() .

The code is as follows:

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

Copy after login

The difference between the above two methods should be the different request methods (one get and one post).
Finally we look at $.ajax():

The code is as follows:

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

Copy after login

Instance
The code of the front-end jsp part is as follows:...
Number of votes:

The code is as follows:

<span id="i<%=id%>"><%=vote_number%></span><br/> 
<a 
onclick
=myvote(<%=id%>); href=&#39;
javascript
:;&#39;">投票</a>

Copy after login

...
The code for the js part is as follows

The code is as follows:

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); 
} 
}); 
}

Copy after login

Return data is json
Returned in the background The json data is as follows
{issucc:,mess:"",votenum:,myid:}
issucc: Whether it was successful
mess: Information, mainly error message, such as not logged in, Exceeding the limit, etc.
votenum: the total number of votes after voting
myid: the id of the vote, the number of votes used to update the page
A registered login instance
js
login.jsp The type returned is In text format, it is "OK" when it is correct, and it is
"error" when it is wrong.

The code is as follows:

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("返回异常");} 
} 
}); 
}); 
});

Copy after login

jsp page
The first responseText format

The code is as follows:

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

Copy after login

The above is the detailed content of Detailed explanation of return value of jquery ajax example. For more information, please follow other related articles on the PHP Chinese website!