jquery Pull-down auto-load

functionMap ()//Custom map{ This. Container =NewObject ();} Map.prototype.put=function(key, value) { This. Container[key] =value;}; Map.prototype.get=function(key) {return  This. Container[key];}; Map.prototype.keySet=function() {    varKeyset =NewArray (); varCount = 0;  for(varKeyinch  This. Container) {        //Skip the Extend function of object        if(Key = = ' Extend '))         {            Continue; } Keyset[count]=key; Count++; }    returnkeyset;};/** * Save all refreshes, key is Containerid + "_LOADBTN"*/pulltorefreshers=NewMap ();/** * Automatic loading*/varPulltorefresh =function(Containerid, Getdatafunc, Loadoninit, manualload)//drop-down call { This. Containerid =Containerid;//For Tag name This. Getdatafunc =Getdatafunc;//Get the next page of the function
     This. Loadoninit =Loadoninit; //when Loadoninit is true, the scroll event is triggered when the auto-load is complete and needs to be ignored     This. Firstload =true; /** * Loading*/     This. Loading =false; Pulltorefreshers.put (Containerid+ "_loadbtn", This);  This. onscroll =function()    {        if(Pulltorefreshers.get (Containerid + "_loadbtn")). Loadoninit&& Pulltorefreshers.get (Containerid + "_LOADBTN"). Firstload) {pulltorefreshers.get (Containerid+ "_loadbtn"). Firstload =false; return; }        if(!pulltorefreshers.get (Containerid + "_loadbtn")). Loading) {//compatible with each browser            varClientHeight =Document.documentElement.clientHeight; if(ClientHeight = = 0) {clientheight+=Document.body.clientHeight; }            varScrollTop =Document.documentElement.scrollTop; if(ScrollTop = = 0) {scrolltop+=Document.body.scrollTop; }            varScrollHeight =Document.documentElement.scrollHeight; if(ScrollHeight = = 0) {scrollheight+=Document.body.scrollHeight; }                //Scroll to the bottom            if(clientheight+scrolltop>=scrollheight) {Pulltorefreshers.get (Containerid+ "_LOADBTN"). Loadnextpage ();    }        }    };  This. Loadnextpage =function() {Loading=true; vardata =Getdatafunc (); if(manualload) {$ ("#" + Containerid + "_LOADBTN"). Remove (); }                $("#" +containerid). append (data); if(manualload) {varLOADBTN = "<div id=" +Containerid+ "_loadbtn '" + "class= ' col-xs-12 ' style= ' cursor:pointer; text-align:center; ' onclick= ' Pulltorefreshers.get (this.id). Loadnextpage () ' > Load more ...</div> '; $("#" +containerid). Append (LOADBTN); } Loading=false;        }; if(manualload) {varLOADBTN = "<div id=" +Containerid+ "_loadbtn '" + "class= ' col-xs-12 ' style= ' cursor:pointer; text-align:center; ' onclick= ' Pulltorefreshers.get (this.id). Loadnextpage () ' > Load more ...</div> '; $("#" +containerid). Append (LOADBTN); }    Else{Window.onscroll= This. onscroll; }    if(loadoninit) { This. Loadnextpage (); }};

Goodslist.tag

<%@ tag body-content= "Empty" pageencoding= "UTF-8" iselignored= "false"%> <%@ taglib prefix= "s" uri= "/ Struts-tags "%><%@ taglib prefix=" C "uri=" Http://java.sun.com/jsp/jstl/core "%><%--goodslist is a static time-limited list of items, Cannot exist with Nextpagefunc--%><%@ attribute name= "Goodslist" required= "false" rtexprvalue= "true" type= " Java.util.List "%> <%--Nextpagefunc is the action name that is invoked when the list of items is dynamically loaded, Goodslist--%><%@ attribute cannot exist with name=" Nextpagefunc "required=" false "Rtexprvalue=" false "Type=" java.lang.String "%> <%--loadoninit to" true " Opening the page will automatically request data--%><%@ attribute name= "Loadoninit" required= "false" Rtexprvalue= "false" type= "java.lang.String" %> <%--Manualload is "true", scrolling page does not automatically load data, need to click Load More button--%><%@ attribute name= "Manualload" required= "false" Rtexprvalue= "false" Type= "java.lang.String"%> <%--generate Nextpagefunc Required parameter JS method name--%><%@ attribute Name= " Paramfunc "required=" false "Rtexprvalue=" false "Type=" java.lang.String "%> <script type=" Text/jaVascript "> $(function(){    /*document.getElementById ("Centerbutton"). style.top= (Document.documentElement.scrollTop) + "px"; document.getElementById ("Centerbutton"). style.left= (document.documentelement.scrollleft+ Document.documentelement.clientwidth-document.getelementbyid ("Centerbutton"). offsetwidth) + "px"; */    if("${nextpagefunc}"! = "")    {        NewPulltorefresh ("Goodslist", NextPage, ${true= = Loadoninit}, ${true==manualload}); }});varCurrentPage = 1;varNumperpage = 10;<c:iftest= "${not Empty Paramfunc}" >varCustomparam =${paramfunc} ();</c:if>functionNextPage () {<c:iftest= "${not Empty Paramfunc}" >varparam =Customparam; </c:if> <c:ifTest= "${empty Paramfunc}" >varparam = {}; </c:if> param["currentpage"] =currentpage; param["Numperpage"] =Numperpage; vardata = eval (Invokejava ("${nextpagefunc}", param)); varDom = "";  for(varOinchdata) {Dom+ = ' <div class= "col-xs-6" onclick= "buy (' + Data[o].goodsid + ')" style= "Cursor:pointer" ><ul class= "Ul2" > Data[o].picurl+ ' "/><br> ' + ' <li style=" color: #b7b7b7; font-size:12px; " > ' +data[o].storename + ' </li> ' + ' <li style= "color: #929292; font-size:14px; " > ' + data[o].goodsname + ' </li> ' + ' <li style= "color: #ef3646; font-size:15px; " > ' +data[o].discount + ' </li> ' + ' <li style= "color: #959595; font-size:12px; " > ' +data[o].price + ' </li> ' + ' <li><i class= "Glyphicon glyphicon-shopping-cart" &GT;&LT;/I&G t;<p> purchase </p></li> ' + ' </ul> ' + ' <br></div> '/*dom + = ' <div class= "col-xs-6" onclick= "buy (' + Data[o].goodsid + ')" style= "Cursor:pointer" ><br> ' + data[o].goodsname + ' <br></div> '*/} currentpage++; /*dom + = ' <div name= ' Centerbutton "id=" Centerbutton "><i class=" Glyphicon glyphicon-th-large "></i ></div> '*/    returnDom;}functionBuy (goodsid) {document.location= "/ushequmobile/getgoodsinfo_goods?goodsid=" +Goodsid; }</script><div id= "Goodslist" > <c:foreachvar= "goods" items= "${goodslist}" varstatus= "status" > <div class= "col-xs-6" onclick= "Buy (${goods.goodsid})" Style        = "Cursor:pointer" > <br> ${goods.goodsname}<br> </div> </c:forEach></div>

Page Call

1<%@ page language= "java" contenttype= "text/html; Charset=utf-8 "pageencoding=" UTF-8 "%>2<% @taglib prefix= "HS" tagdir= "/web-inf/tags"%>3<%@ taglib prefix= "C" uri= "Http://java.sun.com/jsp/jstl/core"%>4<! DOCTYPE html>567<title> Hot Goods </title>8<script type= "Text/javascript" >9$(function()Ten      {     One$ ("#flag"). Val ("${flag}"); A     });  -       -      functionGetParam () the      { -          varData={}; -data["flag"] = "${flag}"; -          +          returndata; -      } +      A</script> at -<body> -<div class= "Container" > -<div class= "Row" > -<div class= "col-xs-12" id= "Refreshcontainer" > in -</div> to              +</div> -</div> the</body> * $  

jquery Pull-down auto-load