<!DOCTYPE html>

<html lang="zh-CN">

    <head>

      <meta charset="UTF-8" />

      <title>滚动条到底部时自己加载新的内容</title>

      <script type='text/javascript' src='js/jquery.js'></script>

        <script type="text/javascript">

          var page_num=2;

          $(document).ready(function(){

            $(window).scroll(function(){

              if($(document).scrollTop()>=$(document).height()-$(window).height()){

                var div1tem = $('#container').height()

                var str =''

                $.ajax({

                    type:"GET",

                    url:'ajaxdata',

                    dataType:'json',

                    beforeSend:function(){

                      $('.ajax_loading').show() //显示加载时候的提示

                    },

                    success:function(ret){

                     $(".after_div").before(ret) //将ajxa请求的数据追加到内容里面

                     $('.ajax_loading').hide() //请求成功,隐藏加载提示

                    }

                })

              }

            })

          })

        </script>

      {/literal}

    </head>

    <body>

     <div>

        <div style='width:100%;height:1200px'>文章内容</div>

        <div class='after_div'></div>

　　　　 <div class='ajax_loading' style='background:#F0F0F0;height:60px;width:100%;text-align:center;line-height:60px;font-size:18px;display:none;position:fixed;bottom:0px'><img src="img/loadinfo.net.gif"> 数据加载中</div>

     </div>

    </body>

</html>

参考：http://www.oschina.net/code/snippet_1042544_20893

Jquery实现滚动到底部加载更多（最原始）的更多相关文章

  1. 滚动到底部加载更多及下拉刷新listview的使用

    最新内容建议直接访问原文:滚动到底部加载更多及下拉刷新listview的使用 本文主要介绍可同时实现下拉刷新及滑动到底部加载更多的ListView的使用. 该ListView优点包括:a. 可自定义下 ...

  2. XRecyclerView：实现下拉刷新、滚动到底部加载更多以及添加header功能的RecyclerView

    介绍: 一个实现了下拉刷新,滚动到底部加载更多以及添加header功能的的RecyclerView.使用方式和RecyclerView完全一致,不需要额外的layout,不需要写特殊的adater. ...

  3. ionic 上拉加载更多&瀑布流加载&滚动到底部加载更多 主意事项

    首先下拉刷新的代码是这样的,标红的地方为关键代码 <html> <head> <meta charset="utf-8"> <meta n ...

  4. jquery页面滑到底部加载更多

    $(window).scroll(function(){ var _scrolltop = $('body').scrollTop();if(_scrolltop+_winHeight>_doc ...

  5. vant list列表滚动到底部加载更多会滚动到顶部问题

    如果使用异步加载数据并使用了vant中的toast做加载中提示,则有可能会导致列表滚动高度为0,也就是回到了顶部.只要在list加载回调里不使用toast就可以避免这个问题.

  6. Android中GridView滚动到底部加载数据终极版

    之前在项目中有一个需求是需要GridView控件,滚动到底部自动加载.但是呢GridView控件并不提供诸如ListView监听滚动到底部的onScrollListener方法,为了实现这样一个效果, ...

  7. Jqeury Mobile实战之切屏效果以及屏幕滚动到底端加载更多和点击切换更多

    http://blog.csdn.net/q718330882/article/details/46120691 //页面滚动到底部加载更多事件 $( window ).scroll(function ...

  8. 使用jquery.more.js上滑加载更多

    html: <div id="more"> <div class="single_item"> <div class=" ...

  9. jQuery实现滚动时动态加载页面内容

    有些网站的网页内容不是一次性加载完毕的,而是在鼠标向下滚动时动态加载的,这是怎么做到的呢?看下面代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 ...

随机推荐

  1. 【转】让Bootstrap 3兼容IE8浏览器

    FROM : http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html 最近在研究Bootstrap(官方,Github)这个 ...

  2. NET Core HTTP 管道

    ASP.NET Core HTTP 管道中的那些事儿   前言 马上2016年就要过去了,时间可是真快啊. 上次写完 Identity 系列之后,反响还不错,所以本来打算写一个 ASP.NET Cor ...

  3. ICSharpCode.SharpZipLib

    ICSharpCode.SharpZipLib 压缩.解压文件 附源码   http://www.icsharpcode.net/opensource/sharpziplib/ 有SharpZipli ...

  4. 【基础】利用thrift实现一个非阻塞带有回调机制的客户端

    假设读者对thrift有一定了解. 客户端有时需要非阻塞的去发送请求,给定服务端一个请求,要求其返回一个计算结果.但是客户端不想等待服务端处理完,而是想发送完这个指令后自己去做其他事情,当结果返回时自 ...

  5. 【活动】写#听云#原创博文 赢取iPhone 6超级大奖

    移动应用的使用量和重要性与日俱增,用户体验的要求也越来越高.与桌面程序相比,移动应用耗电小,速度慢,但手机用户却希望享受到与桌面程序同样的加载速度.那么如何发现移动应用的性能黑洞,优化移动应用性能,这 ...

  6. BGP路由协议详解(完整篇)

    原文链接:http://xuanbo.blog.51cto.com/499334/465596/ 2010-12-27 12:02:45 上个月我写一篇关于BGP协议的博文,曾许诺过要完善这个文档,但 ...

  7. 【Python】 [基础] 条件判断 与 循环 与dict和set

    # 条件判断 elif:  else if 的作用 注意: : [冒号]BMI =w/(h*h) if BMI<15:    print('较轻')elif BMI<25:    prin ...

  8. exce生成随机数

    有时候数据库没有数据,造数据专用. 来源于:http://jingyan.baidu.com/article/93f9803feba1f5e0e46f55f2.html 首先介绍一下如何用RAND() ...

  9. Java--剑指offer（3）

    11．输入一个整数,输出该数二进制表示中1的个数.其中负数用补码表示. a)使用Integer.toBinaryString(n);来计算得出二进制的字符串,然后使用for循环截取字符串是否为1 pu ...

  10. 链栈的C语言实现

    /* 功能:栈的链表实现 Author:lxm Date: 20160511 */ #include <stdio.h> #include <stdlib.h> #define ...