日期:2014-05-16 浏览次数:20469 次
开发环境:vs2010+jquery-1.4.min.js
解决问题:网上代码比较少,好多调试不通,返回数据不用json而用jsonp主要考虑解决跨域问题
开发步骤:打开VS2010,新建一web站点,保存位置选择D:\Website1;添加新项,选择一般处理程序,命名cmdHandler.ashx;添加新项,选择HTML页,命名为testAshx.htm;网上下载jquery-1.4.min.js拷贝到web站点中
项目相关代码和运行截图如下:
1、testAshx.htm代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Jquery调用ashx文件返回的jsonp格式数据实例</title>
<script type="text/javascript" src="jquery-1.4.min.js"></script>
</head>
<body>
<div id="Div1"> </div>
<div id="Div2"> </div>
<div id="Div3"> </div>
<div id="Div4"> </div>
<script type="text/javascript" >
//回调函数1
function success_jsonpCallback11(data) {
var $ul = $("<ul></ul>");
$.each(data, function (i, v) {
$("<li/>").text(v["id"] + " " + v["name"]).appendTo($ul)
});
$("#Div2").html($ul);
}
//回调函数2
function success_jsonpCallback22(data) {
var $ul = $("<ul></ul>");
$.each(data, function (i, v) {
$("<li/>").text(v["OrderID"] + " " + v["CustomerID"]).appendTo($ul)
});
$("#Div4").html($ul);
}
//页面加载完成后执行下面代码
$(document).ready(function () {
//读取Ashx文件中直接返回的字符串
$.ajax({
url: 'cmdHandler.ashx',
data: { StatusCode: 1 },
dataType: "jsonp",
jsonp: "jsonpcallback",
success: function (data) {
var $ul = $("<ul></ul>");
$.each(data, function (i, v) {
&nb