jquery Ajax Example return value detailed _jquery

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

Copy Code code as follows:

$.get ("test.jsp",
{name: ' Cssrain ', Time: ' 2008/01/21 '},//data to be passed
function (data) {
Alert ("Returned data: +");
}
)

Then look at $.post ():
Same as $.get () format.

Copy Code code as follows:

$.post ("test.jsp",
{name: ' Cssrain ', Time: ' 2008/01/21 '},//data to be passed
function (data) {
Alert ("Returned data: +");
}
)

The difference in the above 2 ways should be the way the request is different (a get one post).
Finally we look at $.ajax ():

Copy Code code as follows:

$.ajax ({
URL: ' accept.jsp ',
Type: ' Post ',//Data send mode
DataType: ' HTML ',//Accept data format (there are many, commonly used Html,xml,js,json)
Data: ' text= ' +$ ("#name"). Val () + ' &date= ' +new date (),//To be passed
Error:function () {//Failed
Alert (' Error loading document ');
},
Success:function (msg) {//successful
Alert ("Data Saved:" + msg);
}
});

Instance
The code for the foreground JSP section is as follows: ...
Number of votes:

Copy Code code as follows:

<span id= "I<%=id%>" ><%=vote_number%></span><br/>
<a Onclick=myvote (<%=id%>); href= ' javascript:; ' " > Polling </a>

...
The code for the JS section is as follows

Copy Code code 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 ("Update page");
$ ("#i" +data.myid). HTML (data.votenum);
}
});
}

Return data to JSON
The JSON data returned in the background is as follows
{issucc:,mess: "", Votenum:,myid:}
ISSUCC: Success
Mess: Information, mainly error messages, such as no login, exceeding the limit, etc.
Votenum: Total votes after the vote
myID: The ID of the poll, the number of votes used to update the page
A Registered Login instance
Js
The type returned by login.jsp is the text form and is "OK" when it is correct, when the error is
"Error".

Copy Code code 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 ("return exception");}
}
});
});
});

JSP page
The first type of responsetext format

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