java js webservice_java Web技术探路：js Ajax调用WebService
StuList = new List();
for (int i = 0; i < 10; i++)
{
Student s = new Student();
s.Sid = i + 1;
s.Name = "Tom"+s.Sid;
s.Sex = "男";
s.Age = i + 1;
StuList.Add(s);
}
return StuList;
}
}
}
注意：我們分別看一下這幾個方法的簽名，這很重要，因為方法簽名決定了你調(diào)用必須遵守的規(guī)則，本文中我們用的是post方法，所以只給出post的方法簽名。
1.HelloWebService
說明：請求的頁面的地址: /MyWebService.asmx/HelloWebService;主機地址為:192.168.0.194;端口號：如果不是80端口，必須給出。
調(diào)用該服務(wù)的完整路徑為：http://192.168.0.194:85/MyWebService.asmx/HelloWebService 。(具體情況，具體分析)
2.HelloSomeBody
說明：請求的頁面的地址: /MyWebService.asmx/HelloSomeBody;主機地址為:192.168.0.194;端口號：如果不是80端口，必須給出。
“name=string”說明，請求該服務(wù)時，需要提供參數(shù)。
調(diào)用該服務(wù)的完整路徑為：http://192.168.0.194:85/MyWebService.asmx/HelloSomeBody 。(具體情況，具體分析)
3.SetStudentInfo
說明：請求的頁面的地址: /MyWebService.asmx/SetStudentInfo;主機地址為:192.168.0.194;端口號：如果不是80端口，必須給出。
注意參數(shù)說明。
調(diào)用該服務(wù)的完整路徑為：http://192.168.0.194:85/MyWebService.asmx/SetStudentInfo 。(具體情況，具體分析)
4.GetMulStudentInfos
說明：請求的頁面的地址: /MyWebService.asmx/HelloSomeBody;主機地址為:192.168.0.194;端口號：如果不是80端口，必須給出。
調(diào)用該服務(wù)的完整路徑為：http://192.168.0.194:85/MyWebService.asmx/GetMulStudentInfos。(具體情況，具體分析)
3.下面是核心部分，也就是調(diào)用服務(wù)的Ajax腳本代碼。CallWebService.js
$(document).ready(pageLoad);
// 載入時進行執(zhí)行的方法
function pageLoad() {
BindCallHello();
BindCallBody();
BindGetSingleStudent();
BindGetMulStudents();
}
// 調(diào)用HelloWebService
function BindCallHello(){
$("#btnCallHello").click(function() {
$.ajax({
type: "post", //訪問WebService使用Post方式請求
url: "http://192.168.0.194:85/MyWebService.asmx/HelloWebService", //調(diào)用Url(WebService的地址和方法名稱組合---WsURL/方法名)
data: {}, //這里是要傳遞的參數(shù)，為Json格式{paraName:paraValue}
contentType: "Application/Json", // 發(fā)送信息至服務(wù)器時內(nèi)容編碼類型
beforeSend: function(XMLHttpRequest) {
XMLHttpRequest.setRequestHeader("Accept", "Application/Json"); // 接受的數(shù)據(jù)類型。(貌似不起作用，因為WebService的請求/返回 類型是相同的，由于請求的是Json，所以，返回的默認是Json)
},
success: function(data) {
var jsonValue = data;
alert(jsonValue.d);// 輸出Json
},
complete: function(XMLHttpRequest, textStatus) {
var returnText = XMLHttpRequest.responseText;
$("#backData").html(returnText);// 輸出服務(wù)器端返回數(shù)據(jù)
}
});
});
}
// 調(diào)用調(diào)用HelloSomeBody
function BindCallBody() {
$("#btnCallBody").click(function() {
var name = $("#txtName").val();
$.ajax({
type: "post", //訪問WebService使用Post方式請求
url: "http://192.168.0.194:85/MyWebService.asmx/HelloSomeBody", //調(diào)用Url(WebService的地址和方法名稱組合---WsURL/方法名)
data: "{name:'" + name + "'}", //這里是要傳遞的參數(shù)，為Json格式{paraName:paraValue}
contentType: "Application/Json", // 發(fā)送信息至服務(wù)器時內(nèi)容編碼類型
beforeSend: function(XMLHttpRequest) {
XMLHttpRequest.setRequestHeader("Accept", "Application/Json"); // 接受的數(shù)據(jù)類型。(貌似不起作用，因為WebService的請求/返回 類型是相同的，由于請求的是Json，所以，返回的默認是Json)
},
success: function(data) {
var jsonValue = data;
alert(jsonValue.d); // 輸出Json
},
complete: function(XMLHttpRequest, textStatus) {
var returnText = XMLHttpRequest.responseText;
$("#backData").html(returnText); // 輸出服務(wù)器端返回數(shù)據(jù)
}
});
});
}
function BindGetSingleStudent() {
$("#btnSinStuInfo").click(function() {
var stuSid = $("#txtStuSid").val();
var stuName = $("#txtStuName").val();
var stuSex = $("#txtStuSex").val();
var stuAge = $("#txtStuAge").val();
$.ajax({
type: "post", //訪問WebService使用Post方式請求
url: "http://192.168.0.194:85/MyWebService.asmx/SetStudentInfo", //調(diào)用Url(WebService的地址和方法名稱組合---WsURL/方法名)
data: "{name:'" + stuName +"',sex:'"+stuSex+"',age:'"+stuAge+"',sid:'"+stuSid+ "'}", //這里是要傳遞的參數(shù)，為Json格式{paraName:paraValue}
contentType: "Application/Json", // 發(fā)送信息至服務(wù)器時內(nèi)容編碼類型
beforeSend: function(XMLHttpRequest) {
XMLHttpRequest.setRequestHeader("Accept", "Application/Json"); // 接受的數(shù)據(jù)類型。(貌似不起作用，因為WebService的請求/返回 類型是相同的，由于請求的是Json，所以，返回的默認是Json)
},
success: function(data) {
var jsonValue = data;
alert(jsonValue.d.Sid); // 輸出Json
},
complete: function(XMLHttpRequest, textStatus) {
var returnText = XMLHttpRequest.responseText;
$("#backData").html(returnText); // 輸出服務(wù)器端返回數(shù)據(jù)
}
});
});
}
function BindGetMulStudents() {
$("#btnMulStuInfos").click(function() {
$.ajax({
type: "post", //訪問WebService使用Post方式請求
url: "http://192.168.0.194:85/MyWebService.asmx/GetMulStudentInfos", //調(diào)用Url(WebService的地址和方法名稱組合---WsURL/方法名)
data: {}, //這里是要傳遞的參數(shù)，為Json格式{paraName:paraValue}
contentType: "Application/Json", // 發(fā)送信息至服務(wù)器時內(nèi)容編碼類型
beforeSend: function(XMLHttpRequest) {
XMLHttpRequest.setRequestHeader("Accept", "Application/Json"); // 接受的數(shù)據(jù)類型。(貌似不起作用，因為WebService的請求/返回 類型是相同的，由于請求的是Json，所以，返回的默認是Json)
},
success: function(data) {
var jsonValue = data;
alert(jsonValue.d[0].Sid); // 輸出Json
},
complete: function(XMLHttpRequest, textStatus) {
var returnText = XMLHttpRequest.responseText;
$("#backData").html(returnText); // 輸出服務(wù)器端返回數(shù)據(jù)
}
});
});
}
說明：相關(guān)注釋寫的很詳細，應(yīng)該地球人都知道。應(yīng)該是玩程序的地球人都知道。
總結(jié)：
至此，所有代碼知識點，都已經(jīng)貼出來了。
細心的讀者應(yīng)該能發(fā)現(xiàn)，我之所以很贅述的把4個服務(wù)方法都列了出來，其實是想讓大家看清楚，每個方法的側(cè)重點不同。調(diào)用方法上包括：無參數(shù)的調(diào)用，參數(shù)調(diào)用。
返回值類型上包括：返回字符串，返回自定義實體數(shù)據(jù)。
所有返回值都為Json數(shù)據(jù)。Json數(shù)據(jù)作為返回值，近來大受親睞。
總結(jié)
以上是生活随笔為你收集整理的java js webservice_java Web技术探路：js Ajax调用WebService的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： oracle asm 分布式存储,分布式
- 下一篇： oracle 存储过程打印语句,orac