滚动加载数据

/*首先在页面中引入jquery库*/

<script src="/js/slides.min.jquery.js" type="text/javascript"></script>

/*然后添加下面的js函数*/

 <script type="text/javascript">
var pageno = 2;

        $(function () {
            $(window).bind("scroll", function () {
                $('#ctl00_ContentPlaceHolder1_content').each(function () {
                    var fold = $(window).height() + $(window).scrollTop();
                    //  alert("show:" + $('#show').offset().top + ",height:" + $(window).height() + "|" + fold + "| " + ($('#show').offset().top + 50));
                    if (fold >= ($('#show').offset().top + 50)) {
                        $.get("/handle/index_1.aspx?pageno=" + pageno + "&d=" + Math.random(), function (arg) {
                            if (arg != "") {
                                pageno = pageno + 1;
                                eval("var result=" + arg);
                                $(result.col1).appendTo("#col_1");//第一行
                                $(result.col2).appendTo("#col_2");//第二行
                                $(result.col3).appendTo("#col_3");//第三行
                                $(result.col4).appendTo("#col_4");//第四行
                                $(result.col5).appendTo("#col_5");//第五行
                            } else {
                                $('#show').hide();
                            }
                        });
                    }
                });
            });
        });
</script>

/*在页面需要显示结果的地方使用Literal控件暂时代替，另外再加一个div（用来显示数据读取状态）（上面的行数可以根据实际需求决定）*/

<div class="jz" id="show">
            <img src="/images/loading.gif" />正在加载，请稍后</div>

 

 

另外建一个页面：在后台pageload中加入：

int pageno = Convert.ToInt32(Request.QueryString["pageno"] ?? "2");
            int aid = Convert.ToInt32(Request.QueryString["id"] ?? "0");
            int id = Convert.ToInt32(Request.QueryString["ids"] ?? "0");
            int recordCount = 0;
            string col1 = "";//第一行
            string col2 = "";//第二行
            string col3 = "";//第三行
            string col4 = "";//第四行
            string col5 = "";//第五行
            int num = 0;
            string str = "";
            string tablename = "(select top 100 percent *, row_number()over(order by XiHuan desc,id desc) as num from  YX_Submission order by num) as tmp  ";

//使用分页方法进行数据库中的查询
            DataTable dt = PagingBLL.GetAll(pageno, 15, out recordCount, tablename, " 1=1", "num", 0);

            int n = (int)Math.Ceiling(Convert.ToDouble(recordCount) / 15);
            if (pageno <= n)
            {
                if (dt != null && dt.Rows.Count > 0)
                {
                    for (int i = 0; i < dt.Rows.Count; i++)
                    {
                        if (num == 5)//当循环到第五行的时候重新从第一行开始添加数据
                        {
                            num = 0;
                        }
                        if (num == 0)
                        {
                          //以下col1中的样式以及其中的字段可根据自己的实际需求进行修改
                            col1 += "<li>";
                            col1 += "<div class='pic'>";
                            col1 += "<a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>";
                            col1 += "<img src='/UploadFile/Submission/" + dt.Rows[i]["SubImg"] + "' width='182' /></a>";
                            col1 += "<a style='width: 60px;' class='like' onclick='likejiyi(" + dt.Rows[i]["ID"] + ")' id='like2' likelabel='false'><i class='icon'> </i><span>喜欢</span></a>";
                            col1 += "<div class='author'>";
                            col1 += "</div>";
                            col1 += "</div>";
                            col1 += "<div class='txt'>";
                            col1 += "<span><a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>" + dt.Rows[i]["Subname"] + "</a></span></div>";
                            col1 += "<div class='txt2'>";
                            col1 += "<div class='clear'>";
                            col1 += "</div></div>";
                            col1 += "</li>";
                          
                        }
                        if (num == 1)
                        {
                         
                            col2 += "<li>";
                            col2 += "<div class='pic'>";
                            col2 += "<a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>";
                            col2 += "<img src='/UploadFile/Submission/" + dt.Rows[i]["SubImg"] + "' width='182' /></a>";
                            col2 += "<a style='width: 60px;' class='like' onclick='likejiyi(" + dt.Rows[i]["ID"] + ")' id='like2' likelabel='false'><i class='icon'> </i><span>喜欢</span></a>";
                            col2 += "<div class='author'>";
                             col2 += "</div>";
                            col2 += "</div>";
                            col2 += "<div class='txt'>";
                            col2 += "<span><a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>" + dt.Rows[i]["Subname"] + "</a></span></div>";
                            col2 += "<div class='txt2'>";
                            col2 += "<div class='clear'>";
                            col2 += "</div></div>";
                            col2 += "</li>";
                           
                        }
                        if (num == 2)
                        {
                          
                            col3 += "<li>";
                            col3 += "<div class='pic'>";
                            col3 += "<a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>";
                            col3 += "<img src='/UploadFile/Submission/" + dt.Rows[i]["SubImg"] + "' width='182' /></a>";
                            col3 += "<a style='width: 60px;' class='like' onclick='likejiyi(" + dt.Rows[i]["ID"] + ")' id='like2' likelabel='false'><i class='icon'> </i><span>喜欢</span></a>";
                            col3 += "<div class='author'>";
                            col3 += "</div>";
                            col3 += "</div>";
                            col3 += "<div class='txt'>";
                            col3 += "<span><a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>" + dt.Rows[i]["Subname"] + "</a></span></div>";
                            col3 += "<div class='txt2'>";
                            col3 += "<div class='clear'>";
                            col3 += "</div></div>";
                            col3 += "<li>";
                            
                        }
                        if (num == 3)
                        {
                           
                            col4 += "<li>";
                            col4 += "<div class='pic'>";
                            col4 += "<a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>";
                            col4 += "<img src='/UploadFile/Submission/" + dt.Rows[i]["SubImg"] + "' width='182' /></a>";
                            col4 += "<a style='width: 60px;' class='like' onclick='likejiyi(" + dt.Rows[i]["ID"] + ")' id='like2' likelabel='false'><i class='icon'> </i><span>喜欢</span></a>";
                            col4 += "<div class='author'>";
                                                        col4 += "</div>";
                            col4 += "</div>";
                            col4 += "<div class='txt'>";
                            col4 += "<span><a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>" + dt.Rows[i]["Subname"] + "</a></span></div>";
                            col4 += "<div class='txt2'>";
                            col4 += "<div class='clear'>";
                            col4 += "</div></div>";
                           col4+="</li>";
                            
                        }
                        if (num == 4)
                        {
                           
                            col5 += "<li>";
                            col5 += "<div class='pic'>";
                            col5 += "<a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>";
                            col5 += "<img src='/UploadFile/Submission/" + dt.Rows[i]["SubImg"] + "' width='182' /></a>";
                            col5 += "<a style='width: 60px;' class='like' onclick='likejiyi(" + dt.Rows[i]["ID"] + ")' id='like2' likelabel='false'><i class='icon'> </i><span>喜欢</span></a>";
                            col5 += "<div class='author'>";
                            col5 += "</div>";
                            col5 += "</div>";
                            col5 += "<div class='txt'>";
                            col5 += "<span><a href='/activity/detail.aspx?id=" + dt.Rows[i]["id"] + "' target='_blank'>" + dt.Rows[i]["Subname"] + "</a></span></div>";
                            col5 += "<div class='txt2'>";
                            col5 += "<p>" + dt.Rows[i]["SubLabel"] + "</p>";
                            col5 += "<div class='clear'>";
                            col5 += "</div></div>";
                           col5+="</li>";
                           
                        }
                        num++;
                    }
                }
                str = "{\"col1\":\"" + col1 + "\",\"col2\":\"" + col2 + "\",\"col3\":\"" + col3 + "\",\"col4\":\"" + col4 + "\",\"col5\":\"" + col5 + "\"}";
            }
            Response.Write(str);
            Response.End();