JsonP学习

using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization.Json;
using System.Web;
using System.Web.Script.Serialization;

namespace WebApplication1
{
    /// <summary>
    /// JsonPTest 的摘要说明
    /// </summary>
    public class JsonPTest : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            List<Person> list = new List<Person>()
            {
                new Person(){ID=1,Name = "张三"},
                 new Person(){ID=2,Name = "李四"},
                  new Person(){ID=3,Name = "王五"},
                   new Person(){ID=4,Name = "赵六"},
                    new Person(){ID=5,Name = "田七"}
            };
            JavaScriptSerializer jss = new JavaScriptSerializer();
            context.Response.Write("var MyData="+jss.Serialize(list));
            context.Response.End();
            //可以使用DataContractJsonSerializer类将类型实例序列化为JSON字符串,并将JSON字符串反序列化为类型实例。DataContractJsonSerializer在System.Runtime.Serialization.Json命名空间下,
            //.NET Framework 3.5包含在System.ServiceModel.Web.dll中,需要添加对其的引用;.NET Framework 4在System.Runtime.Serialization中。
            //System.Runtime.Serialization.Json.DataContractJsonSerializer dcjs=new DataContractJsonSerializer();
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

    public class Person
    {
        public int ID { get; set; }
        public String Name { get; set; }
    }
}

  通过<script>脚本来得到非本域下的数据

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="js/jquery-1.10.1.js"></script>
    <script type="text/javascript" src="http://localhost:3388/JsonPTest.ashx"></script> <!--1.直接用script标签加载js数据-->
    <script>

        $(function() {
            alert(MyData[0].Name);
        });

    </script>
</head>
    <body>
      
    </body>
</html>

  动态加载:<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="js/jquery-1.10.1.js"></script>
   <!-- <script type="text/javascript" src="http://localhost:3388/JsonPTest.ashx"></script>-->
    <script>
    //2.获得另一台服务器动态页面返回的js数据
var myScript = document.createElement('script'); $(function() { $("#btn1").click(function() { myScript.src = "http://localhost:3388/JsonPTest.ashx"; document.body.appendChild(myScript); }); }); myScript.onload = function() { alert(MyData[0].Name); }; </script> </head> <body> <input type="button" id="btn1" value="加载script"/> </body> </html>

 获得另一台服务器动态页面返回的js数据,同时,还要让它主动调用当前浏览器页面上的js方法

先来看服务器端:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;

namespace WebApplication1
{
    /// <summary>
    /// JsonPTest 的摘要说明
    /// </summary>
    public class JsonPTest : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            List<Person> list = new List<Person>()
            {
                new Person(){ID=1,Name = "张三"},
                 new Person(){ID=2,Name = "李四"},
                  new Person(){ID=3,Name = "王五"},
                   new Person(){ID=4,Name = "赵六"},
                    new Person(){ID=5,Name = "田七"}
            };

            //获取客户端传来的函数名
            String funcName = context.Request.QueryString["funcName"];

            JavaScriptSerializer jss = new JavaScriptSerializer();
            //在服务器端调用函数,并传递参数
            context.Response.Write(funcName + "(" + jss.Serialize(list) + ")");
            context.Response.End();
         
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

    public class Person
    {
        public int ID { get; set; }
        public String Name { get; set; }
    }
}

客户端:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="js/jquery-1.10.1.js"></script>
    <script>
        

        //3.获得另一台服务器动态页面返回的js数据,同时,还要让它主动调用当前浏览器页面上的js方法
        var myScript = document.createElement('script');
        $(function () {
            $("#btn1").click(function () {

                myScript.src = "http://localhost:3388/JsonPTest.ashx?funcName=ShowData";
                document.body.appendChild(myScript);
            });
        });

        //让服务器端来调用该函数
        function ShowData(data) {
            alert(data[0].Name);
        }
       
    </script>
</head>
    <body>
      <input type="button" id="btn1" value="加载script"/>
    </body>
</html>

 

posted @ 2015-09-28 21:25  唔愛吃蘋果  阅读(268)  评论(0)    收藏  举报