<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="jquery/jquery-3.3.1.js"></script>
<script>
$(function () {
$("#test").click(function () {
//============================= 测试：Test() 方法==============================
$.ajax({
url: "http://localhost:53606/WebService.asmx/Test",// 规定发送请求的 URL。
type: "post",// 规定请求的类型（GET 或 POST）。
data: {},// 规定要发送到服务器的数据。
contentType: "application/json",// 发送数据到服务器时所使用的内容类型。默认是："application/x-www-form-urlencoded"。
dataType: "json",// 预期的服务器响应的数据类型。
async: true,// 布尔值，表示请求是否异步处理。默认是 true。
cache: false,// 布尔值，表示浏览器是否缓存被请求页面。默认是 true。
success: function (result, status, xhr) {// 当请求成功时运行的函数。
// 首先一定要明确的时，调用webservice的方法后实际获取到的json格式的字符串是这样的
// "d":"{"msg":"其实我也是json对象的字符串"}"} ，
// jquery通过这个字符串生成的json对象只有一个属性，
// 那就是d，d存储的是webservice方法返回的json格式的字符串信息，
// 而不是json对象，所以不能通过 obj.d.msg来获取msg信息。
// 而是需要 var realobj=eval_r('('+o.d+')')来生成实际的json对象，然后realobj.msg才是需要的信息。
alert(result.d);
},
error: function (xhr, status, error) {// 如果请求失败要运行的函数。
alert(error);
}
});
//============================= 测试：Add() 方法==============================
$.ajax({
url: "http://localhost:53606/WebService.asmx/Add",// 规定发送请求的 URL。
type: "post",// 规定请求的类型（GET 或 POST）。
data: "{'a':'100','b':'200'}",// 规定要发送到服务器的数据。
contentType: "application/json",// 发送数据到服务器时所使用的内容类型。默认是："application/x-www-form-urlencoded"。
dataType: "json",// 预期的服务器响应的数据类型。
async: true,// 布尔值，表示请求是否异步处理。默认是 true。
cache: false,// 布尔值，表示浏览器是否缓存被请求页面。默认是 true。
success: function (result, status, xhr) {// 当请求成功时运行的函数。
alert(result.d);
},
error: function (xhr, status, error) {// 如果请求失败要运行的函数。
alert(error);
}
});
//============================= 测试：GetPersonList() 方法==============================
$.ajax({
url: "http://localhost:53606/WebService.asmx/GetPerson",// 规定发送请求的 URL。
type: "post",// 规定请求的类型（GET 或 POST）。
data: {},// 规定要发送到服务器的数据。
contentType: "application/json",// 发送数据到服务器时所使用的内容类型。默认是："application/x-www-form-urlencoded"。
dataType: "json",// 预期的服务器响应的数据类型。
async: true,// 布尔值，表示请求是否异步处理。默认是 true。
cache: false,// 布尔值，表示浏览器是否缓存被请求页面。默认是 true。
success: function (result, status, xhr) {// 当请求成功时运行的函数。
//alert(result.d);
alert("编号：" + result.d.id + "\r\n姓名：" + result.d.name + "\r\n年龄：" + result.d.age + "\r\n地址：" + result.d.address);
},
error: function (xhr, status, error) {// 如果请求失败要运行的函数。
alert(error);
}
});
//============================= 测试：GetPersonList() 方法==============================
$.ajax({
url: "http://localhost:53606/WebService.asmx/GetPersonList",// 规定发送请求的 URL。
type: "post",// 规定请求的类型（GET 或 POST）。
data: {},// 规定要发送到服务器的数据。
contentType: "application/json",// 发送数据到服务器时所使用的内容类型。默认是："application/x-www-form-urlencoded"。
dataType: "json",// 预期的服务器响应的数据类型。
async: true,// 布尔值，表示请求是否异步处理。默认是 true。
cache: false,// 布尔值，表示浏览器是否缓存被请求页面。默认是 true。
success: function (result, status, xhr) {// 当请求成功时运行的函数。
//alert(result.d);
$.each(result.d, function (_index,_obj) {
alert("编号：" + _obj.id + "\r\n姓名：" + _obj.name + "\r\n年龄：" + _obj.age + "\r\n地址：" + _obj.address);
});
},
error: function (xhr, status, error) {// 如果请求失败要运行的函数。
alert(error);
}
});
});
});
</script>
</head>
<body>
<input id="test" type="button" value="test" />
</body>
</html>
ajax跨域请求WebService.asmx
需积分: 50 173 浏览量
2018-08-22
16:22:58
上传
评论
收藏 316KB RAR 举报
ajax跨域请求调用webservice接口.rar （16个子文件） 
ajax跨域请求调用webservice接口 后台 App_Code 
WebService.cs 2KB WebService.asmx 93B Web.Debug.config 1KB Web.config 2KB 前台 jquery jquery-3.3.1.js 265KB jquery-3.3.1.min.js 85KB Web.Debug.config 1KB Web.config 312B
test.html 6KB .vs ajax跨域请求调用webservice接口 v15 .suo 16KB Server sqlite3 storage.ide-wal 917KB storage.ide-shm 32KB storage.ide 4KB db.lock 0B config applicationhost.config 84KB ajax跨域请求调用webservice接口.sln 3KB资源评论
