-
本文将演示如何在滚动滚动条时从服务器端下载数据。使用Ajax技术从服务器加载数据有助于提高任何Web应用程序的性能，因为在打开的页面中，只有一个来自服务器负载的数据屏幕，需要更多的数据，因为用户可以滚动从服务器加载数据。
背景
这是脸谱网促使我写的代码从服务器又当滚动条滚动加载数据。当我看着脸谱网，我惊讶地发现，当我滚动页面，从服务器的新数据开始被插入到现有的数据。然后，用C实现的#相同的功能，我搜索互联网上的信息，但我没有找到任何文章或博客，实现这一功能的C #。当然，有java和PHP实现的文章，仔细阅读这些文章，我开始在C #写代码。因为我的C #版本运行很成功，我想我愿意分享它，所以我发表这篇文章。
代码
只有几行代码，就可以完成负载时滚动。滚动页面，WebMethod将由客户端调用返回的内容插入到客户端。同时，在客户端，滚动事件将绑定到一个客户端函数（文档就绪），它将从服务器端加载数据。
服务器端方法：此方法用于从数据库或其他数据源获取数据，并根据数据将要插入的控件的格式生成一个HTML字符串。
{ WebMethod }
复制代码如下：字符串getdatafromserver（）
{
字符串=空字符串；
对于（int = i 0；i < 10；i + +）
{
+计数器++
该内容是动态附加的+
滚动到现有的内容。；
}
返回响应；
}
如果您想从数据库加载数据，您可以如下修改代码：
{ }的WebMethod复制代码，代码如下：
字符串getdatafromserver（）
{
数据集DS =新数据集（）；
连接字符串的值在这里
字符串=strconnectionstring ；你的连接字符串的值在这里 / /插入
SqlConnection CON =新的SqlConnection（strconnectionstring）；
将select命令值写为第一个参数
SqlCommand命令=新SqlCommand（SELECT * FROM人
SqlDataAdapter ADP =新SqlDataAdapter（命令）；
int retval = ADP填充（DS）；
字符串=空字符串；
为（int i = 1；i < DS表{ 0 }。rows.count；i++）
{
strcomment =空字符串的字符串；
如果（ds.tables！= null）
{
如果（表{ 0 }）！= null）
{
如果（DS表{ 0 }。rows.count > 0）
{
如果（DS表{ 0 }。rows.count > = i - 1）
{
如果（表0 { }，行{ i - 1 } { 0 }）！= DBNull。值）
{
strcomment = DS表{ 0 }，{ 1 }我行- ToString（）{ 0 }；
}
}
}
}
}
分别为+ = ++ strcomment +计数器+ + ；
}
返回响应；
}
客户端的方法：在客户端，我用document.ready方法和结合div的滚动事件的方法，我用了两个DIV元素，maindiv和wrapperdiv，注册滚动事件maindiv插入动态数据为wrapperdiv。
（文件）Ready。
（）函数
{
contentloadtriggered美元= false；
$（# maindiv）。滚动（
（）函数
{
如果（$（# maindiv ）（。scrollTop）（> = $（# wrapperdiv）。Height（-）
$（# maindiv ）Height（））。
contentloadtriggered美元= = false）
contentloadtriggered美元= = false）
{
contentloadtriggered美元=真；
$ ajax（
{
类型：邮政
网址：loadonscroll .aspx / getdatafromserver
数据：{
内容类型：应用程序/ JSON；字符集= UTF-8
DataType：JSON
异步：真，
缓存：false，
成功：函数（MSG）
{
$（# wrapperdiv）。追加（味精。D）；
contentloadtriggered美元= false；
}，
错误：函数（x，E）
{
警报（）服务器端的调用失败。
x.responsetext）；
}
}
）；
}
}
）；
}
）；
这里，检查滚动条是否已移动到底部，使用以下条件。
如果（$（# maindiv）。ScrollTop（> =）
（$（# wrapperdiv）。Height（）$（# maindiv）。Height（））
contentloadtriggered美元= = false）
此条件将决定滚动条是否已到达底部。当它移到底部，动态数据将负载从服务器端和客户端脚本wrapperdiv插入，插入数据到目标元素时将执行异步调用返回成功。
成功：函数（MSG）
{
$（# wrapperdiv）。追加（味精。D）；
contentloadtriggered美元= false；
}
在这里，您将注意到，只有当用户移动到底部时，请求才会发送到服务器。
我贴了好几个样品：
输出