ホームページ > ウェブフロントエンド > jsチュートリアル > jquery ajaxサンプルの戻り値の詳細説明

jquery ajaxサンプルの戻り値の詳細説明

巴扎黑
リリース: 2017-06-30 14:21:13
オリジナル
1165 人が閲覧しました

$.ajax() と ($.post(), $.get()) の主な違いは、コールバックが成功した後は、成功は $.post() のみ、$.get() はのみ実行できることです。

JQuery

には、$.ajax()、$.post、$.get() の 3 つの実装メソッドがあります。 最初に $.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 つのメソッドの違いはリクエスト メソッド (1 つの get と 1 つの 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=&#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、投票数を更新するために使用されますページ
登録ログイン インスタンス
js
login.jsp によって返される型はテキスト形式です。正しい場合は「OK」、間違っている場合は
「エラー」になります。


コードは次のとおりです:

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 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート