jQuery实现的自动加载页面功能示例

前端之家收集整理的这篇文章主要介绍了jQuery实现的自动加载页面功能示例前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本文实例讲述了jQuery实现的自动加载页面功能分享给大家供大家参考,具体如下:

demo.html:

---------------

  • 阅谁问君诵,水落清香浮

  • 阅谁问君诵,水落清香浮

  • 阅谁问君诵,水落清香浮

  • 阅谁问君诵,水落清香浮

  • 阅谁问君诵,水落清香浮

  • 阅谁问君诵,水落清香浮

  • 阅谁问君诵,水落清香浮

  • 阅谁问君诵,水落清香浮

  • +++++++++++++++

  • scrollpagination.js:

    = $(document).height() - $(target).height(); if (mayLoadContent){ if (opts.beforeLoad != null){ opts.beforeLoad(); } $(obj).children().attr('rel','loaded'); $.ajax({ type: 'POST',url: opts.contentPage,data: opts.contentData,success: function(data){ $(obj).append(data); var objectsRendered = $(obj).children('[rel!=loaded]'); if (opts.afterLoad != null){ opts.afterLoad(objectsRendered); } },dataType: 'html' }); } }; $.fn.scrollPagination.init = function(obj,opts){ var target = opts.scrollTarget; $(obj).attr('scrollPagination','enabled'); $(target).scroll(function(event){ if ($(obj).attr('scrollPagination') == 'enabled'){ $.fn.scrollPagination.loadContent(obj,opts); } else { event.stopPropagation(); } }); $.fn.scrollPagination.loadContent(obj,opts); }; $.fn.scrollPagination.defaults = { 'contentPage' : null,'contentData' : {},'beforeLoad': null,'afterLoad': null,'scrollTarget': null,'heightOffset': 0 }; })( jQuery );

    index.html:

    猜你在找的jQuery相关文章