JQuery調(diào)用WebServices的方法和4個實例
你甚至為每個ajax請求添加一個后端頁面!
你是不是甚至在想,尼瑪,要是能夠直接調(diào)用C#類文件中的方法就爽了??。ㄟ@里FishLi做了一個框架,有興趣可以去看看)
可是,你大概忘記了,我們是程序員,我們是懶惰的,我們要讓電腦給我們干更多的事情?。ㄟ@里裝裝13),但其實,微軟和JQuery大牛們早幫我們解決了這個小問題。
大致的調(diào)用分為以下幾種:
一、無參數(shù) 有返回值的調(diào)用
前端JS代碼:
$("#btn1").click(function() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "CalledByJquery.asmx/HelloWorld",
data: "{}",
dataType: "json",
success: function(json) { alert(json.d); },
error: function(error) {
alert("調(diào)用出錯" + error.responseText);
}
});
});
后端WebMethod代碼:
[WebMethod]
public string HelloWorld()
{
return "Hello World";
}
用谷歌調(diào)試的結(jié)果:

二、簡單參數(shù) 簡單返回值的調(diào)用
前端JS代碼:
$("#btn2").click(function() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "CalledByJquery.asmx/SimpleReturns",
data: "{name:'張三'}",
dataType: "json",
success: function(json) { alert(json.d); },
error: function(error) {
alert("調(diào)用出錯" + error.responseText);
}
});
});
后端WebMethod代碼:
[WebMethod]
public string SimpleReturns(string name)
{
return String.Format("您的姓名是{0}", name);
}
用谷歌調(diào)試的結(jié)果:

三、 復雜參數(shù) 復雜返回值的調(diào)用
前端JS代碼:
$("#btn3").click(function() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "CalledByJquery.asmx/GetStudentList",
data: "{stu:{ID:'6',Name:'ff'}}",
dataType: "json",
success: function(json) { alert(json.d); },
error: function(error) {
alert("調(diào)用出錯" + error.responseText);
}
});
});
后端WebMethod:
[WebMethod]
public List<Student> GetStudentList(Student stu)
{
List<Student> studentList = new List<Student>
{
new Student{ID=1,Name="張三"},
new Student{ID=2,Name="李四"}
};
//把從客戶端傳來的實體放回到返回值中
studentList.Add(stu);
return studentList;
}
用谷歌調(diào)試的結(jié)果:
四、返回匿名對象的WebMethod的調(diào)用
前端JS代碼:
$("#btn4").click(function() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "CalledByJquery.asmx/ReturnNoNameClass",
data: "{}",
dataType: "json",
success: function(json) { alert(json.d); },
error: function(error) {
alert("調(diào)用出錯" + error.responseText);
}
});
});
后端WebMethod代碼:
[WebMethod]
public object ReturnNoNameClass()
{
return new { ID = 1, Name = "張三" };
}
用谷歌調(diào)試的結(jié)果:

哈哈,到這里,你是不是也覺得so easy,媽媽再也不用擔心我的學習了,其實很多東西都很簡單,但沒人告訴我們,而我們自己在實際開發(fā)中又沒有這種需求,所以給我們的開發(fā)造成了一定的障礙,
所以,交流啊,是多么滴重要!
相關(guān)文章
jQuery+AJAX實現(xiàn)遮罩層登錄驗證界面(附源碼)
這篇文章主要介紹了jQuery+AJAX實現(xiàn)遮罩層登錄驗證界面,并分享了源碼,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2015-10-10jquery ajaxfileuplod 上傳文件 essyui laoding 效果【防止重復上傳文件】
點擊一次上傳, 當上傳操作結(jié)束后才能操作界面,實現(xiàn)方式是通過 ajaxfileuplod 上傳文件,需要的朋友參考下吧2018-05-05淺談jQuery animate easing的具體使用方法(推薦)
下面小編就為大家?guī)硪黄獪\談jQuery animate easing的具體使用方法(推薦)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-06-06jquery 簡短幾句代碼實現(xiàn)給元素動態(tài)添加及獲取提示信息
雖然是很基本的東西,但為什么很基本的方法就可以實現(xiàn)的東西有些人偏偏還要去追求復雜高深難懂的呢?這里只是交流而已2011-09-09jQuery解析XML文件同時動態(tài)增加js文件的方法
這篇文章主要介紹了jQuery解析XML文件同時動態(tài)增加js文件的方法,涉及jQuery Ajax調(diào)用及返回函數(shù)中增加js文件的相關(guān)使用技巧,需要的朋友可以參考下2015-06-06