> 웹 프론트엔드 > JS 튜토리얼 > jquery ajax 예제의 반환 값에 대한 자세한 설명

jquery ajax 예제의 반환 값에 대한 자세한 설명

巴扎黑
풀어 주다: 2017-06-30 14:21:13
원래의
1165명이 탐색했습니다.

$.ajax()와 ($.post(), $.get())의 주요 차이점은 성공적인 콜백 후에는 $.post(), $.get()만 실행할 수 있다는 것입니다.

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); 
} 
)
로그인 후 복사

위의 두 가지 방법 차이점은 요청 방법(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 ); 
} 
});
로그인 후 복사

인스턴스
front-end jsp 부분의 코드는 다음과 같습니다....

득표수:

코드는 다음과 같습니다.

<span id="i<%=id%>"><%=vote_number%></span><br/> 
<a 
onclick
=myvote(<%=id%>); href=&#39;
javascript
:;&#39;">投票</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, 투표 수를 업데이트하는 데 사용됨 the page
등록 로그인 인스턴스 js login.jsp에서 반환된 유형은 텍스트 형식이며, 맞으면 "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 페이지
첫 번째 응답텍스트 형식

코드는 다음과 같습니다.

<%@ 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 예제의 반환 값에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿