public partial class News
{
public int ID{ get; set; }
public int Title{ get; set; }
}
///控制器 返回JSON 格式化JSON我用了第三方的:Newtonsoft.Json 
public string List(int page=)
{
  Response.ContentType = "application/Json";
  List<News> J= db.News.OrderByDescending(p => p.ID).Skip( * page).Take().ToList();
  return JsonConvert.SerializeObject(J);
}
<div class="content">
<ul class="list" id="container">
</ul>
<div style="text-align:center;padding:10px;" id="load">点击显示数据</div>
</div>

javascript 需要jquery支持

    var i = 1;
function JsonLoad() {
LoadJsonDate(i);
} function LoadJsonDate(pageindex) {
i++;
$.get("/json/List", { page: pageindex}, function (data) {
if (data.length > 0) {
var jsonObj = JSON.parse(data);
AddDate(jsonObj);
} else {
$("#load").html("没有了...");
}
});
} function AddDate(jsondate) {
var html = '';
for (var j = 0; j < jsondate.length; j++) {
html += "<li><a href=\"View/" + jsondate[j].ID + "\">" + jsondate[j].title + "</a></li>";
}
$("#container").append(html); if (j < 10) {
$("#load").html("没有了...");
}
} $(function () { JsonLoad();//打开页面就加载 //点击底部加载区就加载//为防止某些低版本手机滚动条事件不稳定
$("#load").click(function () {
$("#load").html("<img src=\"load.gif\" alt=\"正在加载\"/>");
setTimeout("JsonLoad()", 500);//延时加载
}); var winH = $(window).height();
var scrollHandler = function () {
var pageH = $(document.body).height();
var scrollT = $(window).scrollTop();
var h = (pageH - winH - scrollT) / winH;
$("#load").html("点击显示下10条");
if (h <= 0) {
$("#load").html("<img src=\"load.gif\" alt=\"正在加载\"/>");
setTimeout("JsonLoad()", 500);//延时加载
}
} $(window).scroll(scrollHandler); });

MVC+JSON 无限滚动翻页的更多相关文章

  1. [置顶] ios 无限循环翻页源码例子

    原创文章,转载请注明出处:http://blog.csdn.net/donny_zhang/article/details/9923053 demo功能:ios 无限循环翻页源码例子.iphone 6 ...

  2. 自己定义 ViewGroup 支持无限循环翻页之三(响应回调事件)

    大家假设喜欢我的博客,请关注一下我的微博,请点击这里(http://weibo.com/kifile),谢谢 转载请标明出处,再次感谢 ################################ ...

  3. ★android开发--ListView+Json+异步网络图片加载+滚动翻页的例子(图片能缓存,图片不错乱)

    例子中用于解析Json的Gson请自己Google下载 主Activity: package COM.Example.Main; import java.util.HashMap; import ja ...

  4. 手机APP上下滚动翻页效果

    //页面初期加载时        $(document).ready(function () { //加载第一页            LoadList(); //滚动换页            $( ...

  5. WPF解决当ScrollViewer中嵌套ItemsControl时,不能使用鼠标来滚动翻页

    1. ScrollViewer:滚动条容器,当内容超过指定的长度和宽度后,就会出现滚动条,而且可以使用鼠标中键来滚动, 简单例子如下: <Window x:Class="Connect ...

  6. 使用switchPage.js插件jQuery全屏滚动翻页

    1. 先引入jquery.js,再引入switchPage.js 文件地址:点击打开链接 <script src="jquery.min.js"></script ...

  7. 滚动翻页vue

    <template> <div class="home"> <div style="height:100%; width:100%;&quo ...

  8. 10 个 jQuery 的无限滚动的插件:

    很多社交网站都使用了一些新技术来提高用户体验,而无限滚动的翻页技术就是其中一项,当你页面滑到列表底部时候无需点击就自动加载更多的内容. 下面为你推荐 10 个 jQuery 的无限滚动的插件: 1.  ...

  9. 【Android】无限滚动的HorizontalScrollView

    这是一个很简单的功能,作为新手,做一下笔记.也给其它有需要的人提供一个参考. 首先HorizontalScrollView都知道用途了.它可以实现类似“桌面程序”左右切换页的效果.一般情况下里面的页数 ...

随机推荐

  1. C#1 输入输出 常量变量

    C#  输入输出  常量变量 //输出 Console.WriteLine("这是一行文字"); 自动回车的. Console.Write("Hello world&qu ...

  2. Java多线程相关知识

    1)wait()  notify()  sleep() sleep是Thread类的函数,wait和notify是Object的函数. sleep的时候keep对象锁,wait的时候release 对 ...

  3. zoj1025 Wooden Sticks

    DAG转移,从切题的数量来看是一道水题,给你n个棒,大的可以延续小的,问最少上升子序列的个数. 其实这道题是用贪心来写的,因为这是个有向无环图,到达分叉口,每一条路都要便历,所以每条路应该一样对待,有 ...

  4. 使用md5判断网站内容是否被篡改

    该脚本比较简单,判断网站根目录是否被篡改,如果被篡改把篡改的文件发送到管理员邮箱 #!/bin/bash #author:luodi date:// #use md5 to check web sit ...

  5. PHP面试题之优化

    * PHP性能问题 * 1.PHP语法使用的不恰当 * 2.使用PHP语言做了它不擅长的事 * 3.使用PHP语言链接的服务不给力 * 4.PHP自身做不了的事情 * * PHP的性能问题的解决方向 ...

  6. (asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用

    在ASP.NET MVC框架中没有了自己的控件,页面显示完全就回到了写html代码的年代.还好在asp.net mvc框架中也有自带的HtmlHelper和UrlHelper两个帮助类.另外在MvcC ...

  7. CSS随记

    在CSS中,任何元素都可以浮动.浮动元素会生成一个块级框,而不论它本身是何种元素.如果浮动非替换元素,则要指定一个明确的宽度:否则,它们会尽可能地窄. 注释:float属性不具有继承特性,就是说子元素 ...

  8. Oracle EBS-SQL (WIP-11):检查期间任务完工记录数.sql

    select        WE.WIP_ENTITY_NAME                 任务名称,        WDJ.class_code                         ...

  9. Windows 7安装教程(详细图解)

    早前向大家介绍了Windows XP的安装教程,今天思齐再来介绍一下Windows 7的安装教程,Windows 7在安装上相对以前的Windows操作系统都要简单一些,这一点对于尤其是非专业用户来说 ...

  10. 使用keil判断ARM的冷启动和热启动的方法

    微处理器:LPC2114 编译环境:Keil MDK V4.10 思路: 常把单片机系统的复位分为冷启动和热启动.所谓冷启动,也就是一般所说的上电复位,冷启动后片内外RAM的内容是随机的,通常是0x0 ...