您的位置:首页 > Web前端 > JQuery

.net编写webService与使用jquery调用

2012-12-12 15:32 309 查看
.net编写webService,不像j2ee那样的复杂需要框架(CXF、xfire等)和自动化构建工具(Ant、Maven等)的支持。下面,编写一个简单的示例来做一个演示;

先创建MyTest.asmx文件:

-------------------------------------------------------------------------------------------------------------------------------------------

View Code

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" id="btn1" value="调用无参数方法" />
</div>
<div>
<input type="button" id="btn2" value="传入1个参数" />
</div>
<div>
<input type="button" id="btn3" value="返回泛型列表" />
</div>
</form>
</body>
<script type="text/javascript" src="../Js/jquery-ui-1.8.20.custom/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(function () {
//调用无参数方法
$("#btn1").click(function () {
$.ajax({
type: "POST",
contentType: "application/json",
url: "../WebService/MyTest.asmx/HelloWorld",
data: "{}",
dataType: 'json',
success: function (result) {
alert(result.d);
}
});
});

//传入1个参数
$("#btn2").click(function () {
$.ajax({
type: "POST",
contentType: "application/json",
url: "../WebService/MyTest.asmx/HelloWorld2",
data: "{name:'zcw'}",
dataType: 'json',
success: function (result) {
alert(result.d);
}
});
});

//返回泛型列表
$("#btn3").click(function () {
$.ajax({
type: "POST",
contentType: "application/json",
url: "../WebService/MyTest.asmx/GetArray",
data: "{i:50}",
dataType: 'json',
success: function (result) {
alert(result.d.join(" | "));
}
});
});
});
</script>
</html>


其实.net提供了一个供后端人员测试webService的方式:就是直接跑这个.asmx文件;

跑下来就是这样:

---------------------------------------------------------------------------------------------------------------------------------------------------------



------------------------------------------------------------------------------------------------------------------------------------------------------------

然后你就可以手动输入参数的去测试你的代码了。

不过有几点需要提出:asmx文件必须带有这样的声明,否则js无法调用:

[ScriptService] //令WebService成功传入Json参数,并以Json形式返回结果

最好,我想提的一点就是诸如webService或者REST这样的技术其实原理上是比较复杂的,要学习这样的技术,最好能够摆脱这样的可视化操作,逐步的写schema,完成相关的webService的编写才能更加好的去利用这些技术。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: