JavaScript实现翻页功能(附效果图)

效果图：

要点：

displayPage('#pageDiv','goPage','query',10,1,100);

• #pageDiv是显示翻页的div名称。
• goPage是跳转到后面的文本输入框的id，如果有需要可以根据 * 这个参数直接赋值。
• query是查询的方法名称。
• 10是总页数
• 1是当前页数
• 100是总条数。

<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%String path = request.getContextPath();%>
<%String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%>




查询

用js实现的一个翻页。

使用场景：table中的数据通过ajax查询，查询完毕之后调用js生成翻页控件。

displayPage('#pageDiv','goPage','query',10,1,100);

page.js

function displayPage(divObj,inputId,js,records,page,total){
  //设置默认值   
  divObj = divObj||"body";
  inputId = inputId||"goPage";
  js=js||"query";
  records=records||1;
  total=total||0;
  page=page||1;
  var str = "当前第 "+page+" 页";
  str += " 共 "+records+" 页";
  str += " 首页";
  if(page>1){
    str += " 上一页";
  }else{
    str += " 上一页";
  }
  if(page";
  str += " ";
  $(divObj).empty();
  $(divObj).append(str);
}

以上所述是小编给大家介绍的Javascript实现翻页功能(附效果图)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对考高分网网站的支持！