html分页查询

html代码:

 

        

            

                
首页
                
上一页
                
1
                
                
下一页
                
末页
                
共15页
            
            
            

                 | 跳转到第
                
                
                
                页
            
            确认
        
    

js代码:通过点击事件来改变页数，通过页数向后台发送请求获取新的数据；

 //分页
 var page_index = 1;//当前页数,默认第一页为首页
    var page_total = 0;//总共页数,获total/size获得
    var size=16;//每页数量
    var total =0;//总共多少条记录
    $("#first_page").click(function(){
        if(page_index<=1) return;
        page_index=1;
        $("#currentIndex").html(page_index);
        getDisplayList();
    });
    $(".prev").click(function(){
        if(page_index<=1) return;
        page_index--;
        $("#currentIndex").html(page_index);
        getDisplayList();
    });
    $(".next").click(function(){
        if(page_index>=page_total) return;
        page_index++;
        $("#currentIndex").html(page_index);
        getDisplayList();
    });
    $("#last_page").click(function(){
        if(page_index>=page_total) return;
        page_index = page_total;
        $("#currentIndex").html(page_index);
        getDisplayList();
    });
    function _confirm(){
        if (!($("#gotoPage").val())) {
            dialogModule.iTips('请输入页数');
            return;
        }
        var current = $("#gotoPage").val();
        current = parseInt(current);
        if(current<1) return;
        if (current>page_total) {
            current = 1;
            $("#gotoPage").val('1');
        };
        page_index=current;
        $("#currentIndex").html(page_index);
        getDisplayList();
    }
    function num(d){
        if(d>=page_total) return;
        page_index = d;
        getDisplayList();
    }

sql语句:分页查询

		
		
	select * from goodsinfo  
	
	
	 and gno=#{good.gno}
	
	
	 and gname=#{good.gname}
	
	
	 and tino=#{good.tino}
	
	
		
	limit #{num},#{size}
	

实现类代码:

@Override
	public List findByPage(int page, int size, GoodPO po) {
		List list=new ArrayList();
		 list=mapper.findByPage(page, size, po);
		 if(list!=null) {
				return list;
			}
			return null;
	}

controller类:接收前端的数据，去数据库查询最新数据，返回给前端；

@RequestMapping("/findByPage")
@ResponseBody
public List findByPage(int page, int size, GoodPO po) {
	//System.out.println("page:"+page);
	//System.out.println("size:"+size);
	//System.out.println("po:"+po);
	List list=new ArrayList();
	list=gooodBizImpl.findByPage(page, size, po);
	
	return list;
}