包含ajax傳輸json實例的詞條

本文目錄一覽：

• 1、Ajax調用restful接口傳送Json格式數據的方法
• 2、ajax如何傳遞json格式的參數
• 3、js ajax怎麼傳送json數據
• 4、ajax傳遞json，然後服務器接受json的代碼編寫
• 5、如何使用ajax將json傳入後台數據

Ajax調用restful接口傳送Json格式數據的方法

ajax傳送json格式數據，關鍵是指定contentType，data要是json格式

如果是restful接口，把type改成對應的post（增）、delete（刪）、put（改）、get（查）即可

var

post_data={“name”:”test001″,”pass”:”xxxx”};

$.ajax({

url:

“”,

type:

‘post’,

contentType:

“application/json;

charset=utf-8″,

data:JSON.stringify(post_data),

success:function

(data)

{

//調用成功

},

error:

function(data,

textStatus,

errorThrown){

//調用失敗

}

});

以上所述是小編給大家介紹的Ajax調用restful接口傳送Json格式數據的方法的全部敘述，希望對大家有所幫助，如果大家想了解更多內容敬請關註腳本之家網站！

ajax如何傳遞json格式的參數

Ajax中傳遞Json格式的參數

$.ajax({

type: “post”,

url: baseUrl+”sys/login”,

dataType: “json”,

contentType: “application/json;charset=utf-8”,

data: JSON.stringify({userName: loginapp.userName,userPassword: loginapp.userPassword}),

或者拼接字符串的形式：

data: “{‘userName’: ‘”+loginapp.userName+”‘,’userPassword’: ‘”+loginapp.userPassword+”‘}”,

js ajax怎麼傳送json數據

JSONArray json = JSONArray.fromObject(models); //list集合數據轉json

response.getWriter().println(json);//傳到前台

//ajax

success: function(data){

var models = eval(“(“+data+”)”);

var rows=””;

for(var i in models){

rows =rows + “tr”+

“td”+models[i].statDate+”/td”+

“td”+models[i].endDate+”/td”+

“td”+models[i].name+”/td”+

“/tr” ;

}

$(“#show_table”).append(rows);//添加到table

PS：這是Servlet的寫法

ajax傳遞json，然後服務器接受json的代碼編寫

1.ajax發送請求（建議使用jQuery）：

$.ajax({

method:post;

url: “你要發送到後台去的地址”,

parameter:你要傳送的數據,

beforeSend:function(){在發送請求之前你要做的事}

afterSend:function(){在發送請求後你想做的事}

success:function(){alert(‘成功了！’)}

});

2.後台處理JSON數據：

1）最基本的原理性解決辦法：JSON不過是通過request對象傳過來的鍵值對而已，直接獲得request對象，去對應的屬性就行了。

2）net.sf.json.JSONObject這個包你可以學習下，也不是很難。

3.關於返回頁面：

你要控制頁面跳轉么？那你使用AJAX干毛啊？使用AJAX就是為了不刷新頁面而把值傳到後台去的。

如何使用ajax將json傳入後台數據

首先採用jquery內部封裝好的方法是比較簡單的，我們只需做的就是修改裏面的一些配置：

以下代碼是對$.ajax()的解析：

$.ajax({

type: “POST”, //提交方式

contentType: “application/json; charset=utf-8”, //內容類型

dataType: “json”, //類型

url: “前台地址/後台方法”, //提交的頁面，方法名

data: “parameter”, //參數，如果沒有，可以為null

success: function (data) { //如果執行成功，那麼執行此方法

alert(data.d); //用data.d來獲取後台傳過來的json語句，或者是單純的語句

},

error: function (err) { //如果執行不成功，那麼執行此方法

alert(“err:” + err);

}

});

當然我初次學習的時候，看到這些也是有些茫然的，因為不知道到如何才能將其用到自己的程序裏面，所以就寫了一個小的檢測網頁來測試一下，如果你測試的時候沒有達到你想要的結果，那麼希望你回頭看一下，前台是否寫的有問題，或者是參考一下下文中的注意事項吧。

前台代碼 ：

%@ Page Language=”C#” AutoEventWireup=”true” CodeBehind=”number3.aspx.cs” Inherits=”ajax1.number3″ %

!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “”

html xmlns=””

head runat=”server”

title測試ajax/title

script src=”js/jquery-1.4.1.js” type=”text/javascript”/script

script type=”text/javascript” language=”javascript”

function testAjax() {

$.ajax({

type: “POST”,

contentType: “application/json; charset=utf-8”,

dataType: “json”,

url: “number3.aspx/GetJson”,//傳入後台的地址/方法

data: “{‘RID’:’123′}”,//參數，這裡是一個json語句

success: function (data) {

var result = data.d;

alert(result);

},

error: function (err) {

alert(“err:” + err);

}

});

}

/script

/head

body

form id=”form1″ runat=”server”

div

button 用button測試ajax/button

input type=”button” value=”testAjax” /

/div

/form

/body

/html

後台代碼：

using System;

using System.Web.Services;

namespace ajax1

{

public partial class number3 : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

[WebMethod]

public static string GetJson(string RID)

{

return “{‘ID’:'” + RID + “‘}”;

}

}

}

後台代碼中以黃色為背景的就是我們要注意的地方：

1.using System.Web.Services;對應下面的[WebMethod]這個一定要加上的。

2.後台寫的方法一定是公共靜態的即一定是public static開頭的。

3.參數一定是前台的data所傳參數的鍵

前台中要注意的地方：

1.大家應該會注意到，前台我用的是兩個button來測試，但是第一個button是不行的，頁面會刷新一下，其實這都是form

id=”form1″

runat=”server”這行代碼的問題，button標籤會提交本頁面的內容，從而導致異步刷新失敗。所以建議大家不要用button標籤。但是如果不得不用的話，解決辦法還是有的，目前我知道的只有兩個：

①：將form id=”form1″

runat=”server”代碼去掉，當然如果本頁面有要提交的內容就會很麻煩了

②：將button onclick=”aaa();return

false;”用button測試ajax/button代碼改為：button

onclick=”aaa();return false;”用button測試ajax/button

2。前台的測試結果是：

那麼我們如何來只獲取json後面的值，而不是整個json語句呢，我們可以將json語句對象化，然後根據鍵來取得對應的值：前台的testAjax()的方法改為：

function testAjax() {

$.ajax({

type: “POST”,

contentType: “application/json; charset=utf-8”,

dataType: “json”,

url: “number3.aspx/GetJson”,

data: “{‘RID’:’123′}”,

success: function (data) {

var result = eval(“(” + data.d + “)”);//這句話是將json語句對象化

alert(result.ID);

},

error: function (err) {

alert(“err:” + err);

}

});

}

此時結果為：

以上就是初步學習json當時遇到的問題所留下的經驗。同時我想驗證一下是否能夠在後台重載方法來實現根據前台的data是否有參數來判斷要執行的方法，所以我將代碼改動了一下：

改動後的前台代碼

%@ Page Language=”C#” AutoEventWireup=”true” CodeBehind=”number3.aspx.cs” Inherits=”ajax1.number3″ %

!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “”

html xmlns=””

head runat=”server”

title測試ajax/title

script src=”js/jquery-1.4.1.js” type=”text/javascript”/script

script type=”text/javascript” language=”javascript”

function testAjax() {

$.ajax({

type: “POST”,

contentType: “application/json; charset=utf-8”,

dataType: “json”,

url: “number3.aspx/GetJson”,

data: “{‘RID’:’123′}”,

success: function (data) {

var result = eval(“(” + data.d + “)”);

alert(result.ID);

},

error: function (err) {

alert(“err:” + err);

}

});

}

function aaa() {

$.ajax({

type: “POST”,

contentType: “application/json; charset=utf-8”,

dataType: “json”,

url: “number3.aspx/GetJson”,

success: function (data) {

alert(data.d);

},

error: function (err) {

alert(“err:” + err);

}

});

}

/script

/head

body

form id=”form1″ runat=”server”

div

button 用button測試ajax/button

input type=”button” value=”testAjax” /

input type=”button” value=”aaa” /

/div

/form

/body

/html

改動後的後台代碼

using System;

using System.Web.Services;

namespace ajax1

{

public partial class number3 : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

[WebMethod]

public static string GetJson()

{

return “hello ajax”;

}

[WebMethod]

public static string GetJson(string RID)

{

return “{‘ID’:'” + RID + “‘}”;

}

}

}

所得的效果為：

第一個和第二個按鈕點擊後效果為：

第三個按鈕點擊後效果為：

所以我的初步結論為：後台的重構函數是不成功的，如果有的重構參數的話，只會執行帶參數的，而不會執行那個不帶參數的。現在還不是太明白為什麼會這樣，所以希望明白原理的分享一下自己的觀點。當然這只是個人觀點，如若有誤，望請指正。