博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
实现类似百度搜索结果的翻页效果
阅读量:7042 次
发布时间:2019-06-28

本文共 5034 字,大约阅读时间需要 16 分钟。

hot3.png

/** * 初始化结果信息的第一页面 * @param results * @returns */function initResultInfoPage_util(results){	//绘制第一页	redrawIndexResultPage_util(results, 1);	//绘制页码导航	var totalItemNumber = results.length	redrawPageNumberNavigation_util(totalItemNumber, 1)}/** * 重绘指定索引的页面 * @param results * @param index * @returns */function redrawIndexResultPage_util(results, currentIndex){	var innerHtml = "";		var totalItemNumber = results.length;	var startIndex = (currentIndex-1) * RESULT_SHOW_THRESHOLD; //计算当前页码开始绘制item的下标	var endIndex = currentIndex * RESULT_SHOW_THRESHOLD - 1; //计算当前页码结束绘制item的下标	if( endIndex >= totalItemNumber )	{//页码超过最大item数目时,将最后item对应的下标赋给endIndex		endIndex = totalItemNumber - 1;	}	for(var index = startIndex; index <= endIndex; index++  )	{		var item = results[index];		var lawyerId = ""; 		var lawyerName = item.name;		var lawyerInstitution = item.institution;		var summary = generateSummary_util(item.introduction);		innerHtml += '
' + '
  ' + lawyerInstitution + '

' + '

' + summary + '

' + '
'; } $("#results_showItemList").html(innerHtml);//绘制结果的展示页}/** * 通过信息对,生成总结 * @param infos * @returns */function generateSummary_util(infos){ var summary = ""; var count = 0; $.each(infos, function(key, value) { if( count > 0 ) { summary += "," } summary += key + '' + value + '' count ++; }) return summary;}/** * 重绘页码导航:一共有4种情况。 * [1]如果大于最大页码展示的范围,则根据激活的页码,计算开始和结束绘制的页码: * [1.1]当前上界大于总最大页码时; * [1.2]当前下界界小于等于0时; * [1.3]其余情况,开始和结束绘制页码,分别等于当前页码的下界和上界. * [2]如果最大总页码小于最大页码展示的范围,则开始和结束绘制页码,始终分别为1和maxPageNumber. * @param totalItemNumber * @param currentIndex * @returns */function redrawPageNumberNavigation_util(totalItemNumber, currentIndex){ currentIndex = parseInt(currentIndex); var maxPageNumber = parseInt(totalItemNumber / RESULT_SHOW_THRESHOLD) ; //计算最大页码 if(totalItemNumber % RESULT_SHOW_THRESHOLD != 0) {//当有余数时,则最大页码加1 maxPageNumber += 1; } var startPageNumber = 0; //计算开始绘制的页码 var endPageNumber = 0; //计算结束绘制的页码 if(maxPageNumber > PAGE_NUMBER_THRESHOLD) {//[1]如果大于最大页码展示的范围,则根据激活的页码,计算开始和结束绘制的页码 var lowerBound = currentIndex - ( PAGE_NUMBER_THRESHOLD/2 ); //计算当前页码的下边界 var upperBound = currentIndex + ( PAGE_NUMBER_THRESHOLD/2 ) - 1; //计算当前页码的上边界 if(upperBound > maxPageNumber) {//[1.1]当前上界大于总最大页码时 endPageNumber = maxPageNumber; //在总页码大于最大展示页码的前提下,当前页码上界大于最大总页码时,结束绘制页码始终为最大总页码. startPageNumber = maxPageNumber - PAGE_NUMBER_THRESHOLD + 1; //此时,开始绘制页码始终为maxPageNumber-PAGE_NUMBER_THRESHOLD+1. }else if(lowerBound <= 0) {//[1.2]当前下界界小于等于0时 startPageNumber = 1; //在总页码大于最大展示页码的前提下,当前页码下界大于等于0时,开始绘制页码始终为1. endPageNumber = PAGE_NUMBER_THRESHOLD; //此时,结束绘制页码始终为PAGE_NUMBER_THRESHOLD. }else {//[1.3]其余情况,开始和结束绘制页码,分别等于当前页码的下界和上界. startPageNumber = lowerBound; endPageNumber = upperBound; } }else {//[2]如果最大总页码小于最大页码展示的范围,则开始和结束绘制页码,始终分别为1和maxPageNumber. startPageNumber = 1; endPageNumber = maxPageNumber; } //根据开始和结束绘制页码,以及当前激活页码,实施绘制页码导航栏。 actionRedrawPageNumberNavigation_util(startPageNumber, endPageNumber, currentIndex); }/** * 根据开始和结束绘制页码,以及当前激活页码,实施绘制页码导航栏。 * @param startPageNumber * @param endPageNumber * @param currentIndex * @returns */function actionRedrawPageNumberNavigation_util(startPageNumber, endPageNumber, currentIndex){ var innerHtml = ""; var disabled = ""; if(currentIndex == startPageNumber) { disabled = ' disabled="true" '; } innerHtml += ''; for(var index = startPageNumber; index <= endPageNumber; index++) { var mark = ''; var markActive = ' markActive="false" ' if(currentIndex == index) { mark = 'active'; markActive = ' markActive="true" ' } innerHtml += ''; } disabled = ""; if(currentIndex == endPageNumber) { disabled = ' disabled="disabled" '; } innerHtml += ''; $("#results_pageNumberNavigation").html(innerHtml);}/** * 点击激活当前页面 */function activeCurrentPage(node){ var markActive = $(node).attr("markActive"); //获取标志 if(markActive == "false" || markActive == false) { var currentPageNumber = $(node).attr("currentPageNumber"); redrawIndexResultPage_util(results_global, currentPageNumber);//重绘项目列表 var totalItemNumber = results_global.length; //获取全局变量items的长度. redrawPageNumberNavigation_util(totalItemNumber, currentPageNumber);//重绘页码导航 }}/** * 点击激活上一页. * @param node * @returns */function activePreviousPage(node){ var previousPageNumber = $(node).attr("previousPageNumber"); //获取上一页的页码 redrawIndexResultPage_util(results_global, previousPageNumber);//重绘项目列表 var totalItemNumber = results_global.length; //获取全局变量items的长度. redrawPageNumberNavigation_util(totalItemNumber, previousPageNumber);//重绘页码导航}/** * 点击激活下一页. * @param node * @returns */function activeNextPage(node){ var nextPageNumber = $(node).attr("nextPageNumber"); //获取下一页的页码 redrawIndexResultPage_util(results_global, nextPageNumber);//重绘项目列表 var totalItemNumber = results_global.length; //获取全局变量items的长度. redrawPageNumberNavigation_util(totalItemNumber, nextPageNumber);//重绘页码导航}

 

转载于:https://my.oschina.net/airship/blog/881607

你可能感兴趣的文章
MongoDB学习
查看>>
Unix删除文件的找回方法
查看>>
8.格式化输出
查看>>
Mac Terminal 设置ls 默认带有颜色显示
查看>>
java中的匿名内部类总结
查看>>
IBM Websphere Message Broker(MB) 教程系列-(2) 创建Broke
查看>>
nginx 代理多个tomcat缓存
查看>>
用浏览器访问网址时,请求头(request header)是根据什么生成的?
查看>>
Webix学习笔记-创建一个基本应用程序-06-和服务器交互之Update
查看>>
maven 使用filter动态处理资源文件变量
查看>>
linux 环境下使用信号量实现司机售票员进程同步,线程同步问题
查看>>
git的使用
查看>>
Android5.0以下开启应用立即闪退问题
查看>>
Fedora22和Ubuntu 配置android SDK的32位库
查看>>
腾讯在线前端规范
查看>>
MySQL查询面试题
查看>>
html 文本输入框效果大汇集
查看>>
Ubuntu12.04安装OpenCV 2.4.1
查看>>
刚刚安装Live Writer
查看>>
页面添加访问统计
查看>>