我要评论本文实例为大家分享了jquery ajax调用页面后台方法，供大家参考，具体内容如下
1.新建demo.aspx页面。
2.首先在该页面的后台文件demos.aspx.cs中添加引用。
using system.web.services;
1）.无参数的方法调用.
大家注意了，这个版本不能低于.net framework 2.0。2.0已下不支持的。
后台代码：
[webmethod]
public static string sayhello()
{
return "hello ajax!";
}
js代码：
$(function() {
$("#btnok").click(function() {
$.ajax({
//要用post方式
type: "post",
//方法所在页面和方法名
url: "demo.aspx/sayhello",
contenttype: "application/json; charset=utf-8",
datatype: "json",
success: function(data) {
//返回的数据用data.d获取内容
alert(data.d);
},
error: function(err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
});
页面代码：
<form id="form1" runat="server">
<div>
<asp:button id="btnok" runat="server" text="验证用户" />
</div>
</form>
运行效果如下：
2）.有参数方法调用
后台代码：
[webmethod]
public static string getstr(string str, string str2)
{
return str + str2;
}
js代码：
$(function() {
$("#btnok").click(function() {
$.ajax({
type: "post",
url: "demo.aspx/getstr",
//方法传参的写法一定要对，str为形参的名字,str2为第二个形参的名字
data: "{'str':'我是','str2':'xxx'}",
contenttype: "application/json; charset=utf-8",
datatype: "json",
success: function(data) {
//返回的数据用data.d获取内容
alert(data.d);
},
error: function(err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
});
运行效果如下：
3）.返回数组方法
后台代码：
[webmethod]
public static list<string> getarray()
{
list<string> li = new list<string>();
for (int i = 0; i < 10; i++)
li.add(i + "");
return li;
}
js代码：
$(function() {
$("#btnok").click(function() {
$.ajax({
type: "post",
url: "demo.aspx/getarray",
contenttype: "application/json; charset=utf-8",
datatype: "json",
success: function(data) {
//插入前先清空ul
$("#list").html("");
//递归获取数据
$(data.d).each(function() {
//插入结果到li里面
$("#list").append("<li>" + this + "</li>");
});
alert(data.d);
},
error: function(err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
});
页面代码：
<form id="form1" runat="server"> <div> <asp:button id="btnok" runat="server" text="验证用户" /> </div> <ul id="list"> </ul> </form>
运行结果图：
jquery ajax实现调用页面后台方法就为大家介绍到这，希望对大家的学习有所启发。
您可能感兴趣的文章:
如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！
网友评论