zoukankan      html  css  js  c++  java
  • layer .net中使用

    在.net中使用layer得用ajax来请求一般处理程序来得到想要的json数据,直接上代码

    html:

    <head runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>layer</title>
        <script src="layer/jquery-1.9.1.min.js"></script>
        <script src="layer/layer.min.js"></script>
        <script src="layer/extend/layer.ext.js"></script>
    </head>
    <body>
        <div style=" 100%; height: 100%; text-align: center;">
            <div id="testMaxmin" style=" 100px; height: 100px; background-color: #808080"></div>
            <script>
                $('#testMaxmin').on('click', function () {
                    $.layer({
                        type: 2,
                        maxmin: true,
                        title: '网络电视',
                        area: ['580px', '350px'],
                        iframe: {
                            src: 'http://t.cn/zW9SbfS'
                        }
                    })
                });
            </script>
            <div id="testPhotos" style=" 100px; height: 100px; background-color: #ff6a00">
                </div>
            <script>
                var photos;
                $('#testPhotos').on('click', function () {
                    //判断是否已经请求过相册,已请求过,则直接读取缓存数据
                    if (photos) {
                        layer.photos({
                            html: '', //如果此处传入html值,则右侧区域会显示,不传则不显示
                            json: photos
                        });
                    } else {
                        layer.load();
                        $.ajax({
                            url: "handler.ashx",
                            type: "post"
                        }).done(function (da) {
                            json = JSON.parse(da);
                            photos = json;
                            layer.photos({
                                html: '', //如果此处传入html值,则右侧区域会显示,不传则不显示
                                json: json
                            });
                            layer.closeLoad()
                        });
                    }
                });
            </script>
        </div>
    </body>
    

     handler.ashx

    public void ProcessRequest(HttpContext context)
        {
            JavaScriptSerializer jss = new JavaScriptSerializer();
            context.Response.ContentType = "text/plain";
            string data = "{"status": 1,"msg": "","title": "hahahaha","id": 8,"start": 0,"data": [{"name": "qwe","pid": 109,"src": "../images/1.jpg","thumb": "","area": [638,851]},{"name": "weq","pid": 110,"src": "../images/2.jpg","thumb": "","area": [638,851]}]}";
    
            context.Response.Write(data);
        }
    

     图片地址什么的可以自己改,一定注意要引用js,jquery要1.8以上!

  • 相关阅读:
    第八周作业
    第八周上机练习
    第七周作业
    第七次上机练习
    第六周作业
    4.9上机作业
    第五周作业
    第四次JAVA作业
    第四周作业
    第十六次作业
  • 原文地址:https://www.cnblogs.com/LiuLiangXuan/p/4214696.html
Copyright © 2011-2022 走看看