Home >Web Front-end >JS Tutorial >Detailed explanation of return value of jquery ajax example

Detailed explanation of return value of jquery ajax example

巴扎黑
巴扎黑Original
2017-06-30 14:21:131166browse

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

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

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

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>


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

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

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

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!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn