easyUI自带的翻页功能,如上图所示。输入框那里填写上数字后按下回车就可以跳转到相应页面。
现在我想做成如下图所示的样子。
希望输入框填好数字后,点击GO按钮的效果和直接按回车一样。应该怎么做。
目前我写的方法如下,现在页面上的 GO按钮无法点击,点了也没反应。
应该怎么修改这个方法。
//翻页工具栏文字
if ($.fn.pagination){
$.fn.pagination.defaults.showPageList=true;
$.fn.pagination.defaults.beforePageText="第";
$.fn.pagination.defaults.afterPageText = "页 <a style='border:0;text-decoration:none; font-size:15px;font-weight:bold;color:#8DB2E3' href='javascript:void(0);' onclick='jumpPage()'>GO</a> 共 {pages} 页";
$.fn.pagination.defaults.displayMsg ="当前{from}-{to} 条 共{total}条记录";
}
jumpPage手动调用datagrid的reload方法重载数据就行了,如果你要兼容性好的话,修改源代码,回车事件增加一个参数,然后获取到页数输入框后trigger下keydown.pagination事件
bb.num.unbind(".pagination").bind("keydown.pagination",function(e){//大概1057行
if(e.keyCode==13){
====>
bb.num.unbind(".pagination").bind("keydown.pagination",function(e,data){
if(e.keyCode==13||(data&&data.keyCode==13)){
onclick='jumpPage(this)'
window.jumpPage = function (btn) {
var ipt = $(btn).closest('td').prev().find('input');
ipt.trigger('keydown.pagination', { keyCode: 13 });
}
$.fn.pagination.defaults.afterPageText = "页 <a style='border:0;text-decoration:none; font-size:15px;font-weight:bold;color:#8DB2E3' href='javascript:void(0);' onclick='jumpPage()'>GO</a> 共 {pages} 页";
楼上的兄弟,我这行代码是不是写的有问题。图里面的 GO 不能点击啊。灰色的
注意jumpPage函数作用域需要在window作用域下,不要搞成私有函数。f12打开开发工具看错误