模仿 jqgrid 分页输入页码点击回车键进行跳转

最新推荐文章于 2021-06-03 04:11:47 发布

最新推荐文章于 2021-06-03 04:11:47 发布 · 848 阅读

文章标签：

#javascript #ViewUI

WEB前端同时被 2 个专栏收录

64 篇文章

订阅专栏

javascript

57 篇文章

订阅专栏

本文介绍了一个基于jqGrid的页码输入处理方法。通过监听键盘事件，实现了当用户在特定输入框中按下回车键时，能够跳转到指定的页面，并更新父级页面中的当前页码值。

其实这段代码也就是jqgrid的源码

比如输入框为 <input type="text" id="inputPage" maxlength="7" size="2" value=""/>

那么输入页码的处理代码如下：

$('#inputPage').keypress( function(e) {
			var key = e.charCode || e.keyCode || 0;
			if(key === 13) {//回车键
				var tPage = getTotalPage();//获取总页数
				var page =1;
				if ($(this).val()>0){
					page = ($(this).val()>=tPage) ? tPage:$(this).val();
				}else{
					page = 1;
				}
				gotoPage(page);//跳转请求数据
                                
                                //因为我这个页面在iframe里，我将当前页码放到父页面中，刷新iframe里面页面的时候，再将这个输入页码放回到输入框内进行显示,currentPage 是隐藏输入框在父页面中
				window.parent.document.getElementById('currentPage').value=page;
				//return false;
			}
			//return this;
		});