滚动加载数据

<!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 runat="server">
    <title>华人QQ群</title>
    <link href="css/coon.css" rel="stylesheet" type="text/css" />
    <link href="css/index.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.artZoom.js" type="text/javascript"></script>
    <link href="js/jquery.artZoom.css" rel="stylesheet" type="text/css" />
    <link href="css/button.css" rel="stylesheet" type="text/css" />
    <script language="javascript" type="text/javascript">
        $(document).ready(function () {

            $(".huiyuan li").mousemove(function () {
                $(this).css({ "background": "#FFFF99" });
            });
            $(".huiyuan li").mouseout(function () {
                $(this).css({ "background": "none" });
            });
        });
    </script>
    <script language="javascript" type="text/javascript">
        $(document).ready(function () {
            $("#addmeg").click(function () {
                $.ajax({
                    type: "Post",
                    url: "ashx/AddMeg.ashx",
                    data: { content: $("#txtcontent").val() },
                    dataType: "json",
                    success: function (data) {
                        $("#txtcontent").val("");
                        if (data.type.toString() == "Success") {
                            //添加成功
                            alert('添加成功!');
                        }
                        else {
                            //添加失败
                            alert(data.ErrMeg);
                        }
                    },
                    error: function (err) {
                        //ajax异常
                        alert(data.err);
                    }
                });
            });
        });
    </script>
    <script>
        jQuery(function ($) {
            $('.artZoom').artZoom({
                path: './images',   // 设置artZoom图片文件夹路径
                preload: true, 	    // 设置是否提前缓存视野内的大图片
                blur: true, 		// 设置加载大图是否有模糊变清晰的效果
                left: '左旋转', 	// 左旋转按钮文字
                right: '右旋转', 	// 右旋转按钮文字
                source: '看原图'    // 查看原图按钮文字
            });
        });
    </script>
    <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            var num = 2;
            var nScrollHight = 0; //滚动距离总长(注意不是滚动条的长度)
            var nScrollTop = 0;   //滚动到的当前位置
            var nDivHight = $("#chuangti").height();
            $("#chuangti").scroll(function () {
                nScrollHight = $(this)[0].scrollHeight;
                nScrollTop = $(this)[0].scrollTop;
                if (nScrollTop + nDivHight >= nScrollHight) {
                    $.getJSON("ashx/GetMeg.ashx", { page: num }, function (json) {
                        if (json) {
                            $.each(json.Head, function (index, array) {
                                var str = "";
                                str += "<div class=\"duihua\"><div class=\"touxiang\">";
                                str += "<img src=\"images/text.jpg\" />";
                                str += "</div><div class=\"test\">";
                                str += "(" + array.Information_id + ")" + array.Information_content;
                                str += "</div></div>";
                                $("#chuangti").append(str);
                            });
                            num++;
                        } else {
                            alert("没有更多的数据了。。");
                            return false;
                        }
                    });
                }

            });
        });
        function show() {
            $.getJSON("ashx/GetMeg.ashx", { page: 1 }, function (json) {
                if (json) {
                    $.each(json.Head, function (index, array) {
                        var str = "";
                        str += "<div class=\"duihua\"><div class=\"touxiang\">";
                        str += "<img src=\"images/text.jpg\" />";
                        str += "</div><div class=\"test\">";
                        str += "(" + array.Information_id + ")" + array.Information_content;
                        str += "</div></div>";
                        $("#chuangti").append(str);
                    });
                } else {
                    alert("没有更多的数据了。。");
                    return false;
                }
            });
        }
    </script>
</head>
<body onload="show()">
    <form id="form1" runat="server">
    <div id="top">
        <div id="top_cen">
            <div id="logo">
                <img src="../images/logo.png" /></div>
            <div id="fenxiang">
                <!-- JiaThis Button BEGIN -->
                <div class="jiathis_style_32x32" style="float: right;">
                    <a class="jiathis_button_qzone"></a><a class="jiathis_button_tsina"></a><a class="jiathis_button_tqq">
                    </a><a class="jiathis_button_renren"></a><a class="jiathis_button_kaixin001"></a>
                    <a href="http://www.jiathis.com/share" class="jiathis jiathis_txt jtico jtico_jiathis"
                        target="_blank"></a><a class="jiathis_counter_style"></a>
                </div>
                <script type="text/javascript" src="http://v3.jiathis.com/code/jia.js?uid=1346922940473250"
                    charset="utf-8"></script>
                <!-- JiaThis Button END -->
            </div>
            <div id="menu">
                <img class="style1" src="../images/xlwb.png" /></div>
        </div>
    </div>
    <div id="main">
        <div id="content">
            <div id="content_left">
                <div id="chuangti">
                </div>
                <div id="fabukuang">
                    <div id="tiao">
                    </div>
                    <textarea class="txtArea" id="txtcontent"></textarea>
                </div>
            </div>
            <div id="content_right">
                <div class="right_num">
                    网站公告</div>
                <div id="gonggao">
                    根据公安部安排,由辽宁省公安机关单独组建我国第十一支赴利比里亚维和警队,将于7月14日到中国维和警察培训中心集结,7月19日正式赴利执行维和任务。这是我省公安机关首次单独组建维和警队赴外执行维和任务。为鼓舞士气,激励斗志,辽</div>
                <div class="right_num">
                    在线会员(13/100)</div>
                <ul class="huiyuan">
                    <li>
                        <div class="hy_touxiang">
                            <img src="images/text.jpg" /></div>
                        <div class="hy_name">
                            <div class="hy_name_a">
                                冬日阳光(450688932)</div>
                            <div class="hy_name_b">
                                <a href="#">发送私信</a></div>
                        </div>
                    </li>
                    <li>
                        <div class="hy_touxiang">
                            <img src="images/text.jpg" /></div>
                        <div class="hy_name">
                            <div class="hy_name_a">
                                冬日阳光(450688932)</div>
                            <div class="hy_name_b">
                                <a href="#">发送私信</a></div>
                        </div>
                    </li>
                    <li>
                        <div class="hy_touxiang">
                            <img src="images/text.jpg" /></div>
                        <div class="hy_name">
                            <div class="hy_name_a">
                                冬日阳光(450688932)</div>
                            <div class="hy_name_b">
                                <a href="#">发送私信</a></div>
                        </div>
                    </li>
                    <li>
                        <div class="hy_touxiang">
                            <img src="images/text.jpg" /></div>
                        <div class="hy_name">
                            <div class="hy_name_a">
                                冬日阳光(450688932)</div>
                            <div class="hy_name_b">
                                <a href="#">发送私信</a></div>
                        </div>
                    </li>
                    <li>
                        <div class="hy_touxiang">
                            <img src="images/text.jpg" /></div>
                        <div class="hy_name">
                            <div class="hy_name_a">
                                冬日阳光(450688932)</div>
                            <div class="hy_name_b">
                                <a href="#">发送私信</a></div>
                        </div>
                    </li>
                    <li>
                        <div class="hy_touxiang">
                            <img src="images/text.jpg" /></div>
                        <div class="hy_name">
                            <div class="hy_name_a">
                                冬日阳光(450688932)</div>
                            <div class="hy_name_b">
                                <a href="#">发送私信</a></div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
        <div id="butten">
            <div id="fasong">
                <a class="button primary" id="addmeg">发送信息</a></div>
        </div>
    </div>
    </form>
</body>
</html>

  

using System;
using System.Collections.Generic;
using System.Web;
using Maticsoft.Model;
using System.Data;
using System.Text;

namespace Maticsoft.Web.ashx
{
    /// <summary>
    /// GetMeg 的摘要说明
    /// </summary>
    public class GetMeg : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            Maticsoft.BLL.InformationManager ibll = new BLL.InformationManager();
            context.Response.ContentType = "application/json";
            int PageIndex = Convert.ToInt32(context.Request.Params["page"]);
            //Param p = new Param();
            //p.PageSize = 10;
            //p.PageIndex = PageIndex;
            //p.QueryCondition = "";
            //p.OrderStr = "Information_id DESC";
            //p.TableName = "T_Information";
            //p.PrimaryKey = "Information_id";
            //p.QueryFieldName = "Information_id";
            //p.Group = string.Empty;
            //DataSet ds = ibll.GetList(p);
            DataSet ds = ibll.GetList("", 7, PageIndex);
            string json = CreateJsonParameters(ds.Tables[0]);
            context.Response.Write(json);

        }
        public string CreateJsonParameters(DataTable dt)
        {
            StringBuilder JsonString = new StringBuilder();
            if (dt != null && dt.Rows.Count > 0)
            {
                JsonString.Append("{ ");
                JsonString.Append("\"Head\":[ ");
                for (int i = 0; i < dt.Rows.Count; i++)
                {
                    JsonString.Append("{ ");
                    for (int j = 0; j < dt.Columns.Count; j++)
                    {
                        if (j < dt.Columns.Count - 1)
                        {
                            JsonString.Append("\"" + dt.Columns[j].ColumnName.ToString() + "\":" + "\"" + ToJsonString(dt.Rows[i][j].ToString()) + "\",");
                        }
                        else if (j == dt.Columns.Count - 1)
                        {
                            JsonString.Append("\"" + dt.Columns[j].ColumnName.ToString() + "\":" + "\"" + ToJsonString(dt.Rows[i][j].ToString()) + "\"");
                        }
                    }
                    if (i == dt.Rows.Count - 1)
                    {
                        JsonString.Append("} ");
                    }
                    else
                    {
                        JsonString.Append("}, ");
                    }
                }
                JsonString.Append("]}");
                return JsonString.ToString();
            }
            else
            {
                return null;
            }
        }


        /// <summary>
        /// json特殊字符处理
        /// </summary>
        /// <param name="s">字符串</param>
        /// <returns></returns>
        public static string ToJsonString(string s)
        {
            StringBuilder sb = new StringBuilder();
            for (int i = 0; i < s.Length; i++)
            {
                char c = s.ToCharArray()[i];
                switch (c)
                {
                    case '\"': sb.Append("\\\""); break;
                    case '\\': sb.Append("\\\\"); break;
                    case '/': sb.Append("\\/"); break;
                    case '\b': sb.Append("\\b"); break;
                    case '\f': sb.Append("\\f"); break;
                    case '\n': sb.Append("\\n"); break;
                    case '\r': sb.Append("\\r"); break;
                    case '\t': sb.Append("\\t"); break;
                    case '\0': sb.Append(""); break;
                    default: sb.Append(c); break;
                }
            }
            return sb.ToString();
        }


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

  

posted @ 2012-09-26 17:46  唐学阳  阅读(187)  评论(0)    收藏  举报