jquery模拟按下回车实现代码

250 阅读 0 评论 165 点赞

我是靠谱客的博主欢喜季节，最近开发中收集的这篇文章主要介绍jquery模拟按下回车实现代码，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

简单地记下jquery实现回车事件，代码如下：
全局：

复制代码代码如下:

 
$(function(){ 
document.onkeydown = function(e){ 
var ev = document.all ? window.event : e; 
if(ev.keyCode==13) { 
$('#FormId).submit();//处理事件 
} 
} 
}); 

某个控件：

复制代码代码如下:

 
$('#id').keydown(function(e){ 
if(e.keyCode==13){ 
$('#FormId).submit(); //处理事件 
} 
}); 
if (window.event.keyCode==13) window.event.keyCode=0 　　//这样就取消回车键了 

如果想模拟Tab键，只要写成　if (window.event.keyCode==13) window.event.keyCode=9 就行了，它会跳到另一个元素上。

众所周知easyui 的Pagination中要想跳转到某一页，只需要输入页码按ENTER就能达到效果。前段时间的项目客户提出要求说想要输入页码按一个GO的按钮做跳转。好吧，客户是上帝，他们怎么说我们这些程序猿只能尽自己所能来达到效果。如图：

即：按下GO做输入3按回车一样的事情

而这个问题可以简化为点击一个a标签模拟Pagination页码输入框按下回车但是这个事件是写在jquery.easyui.min.js中,我们没有办法直接调用；通过chrome查询到页码输入框是

复制代码代码如下:

而后查看了JQUERY API 的 Event Object发现 jquery有个trigger方法能够触发模拟的按键事件。直接上代码

复制代码代码如下:

 
<script language="javascript" type="text/javascript"> 
$(document).ready(function () { 
$("#test").datagrid({ 
url: "/Test/Test1Data", 
type: "post", 
datatype: "json", 
width: 465, 
height: 280, 
loadMsg: "数据加载中，请稍后...", 
fitCloumns: true, 
nowrap: true, 
rownumbers: false, 
pagination: true, 
singleSelect: true, 
showFooter: true, 
columns: [[ 
{ field: 'testName', title: '测试名', width:230, editor: 'text'}, 
{field:'testValue',title:'测试值',width:230,align: 'center' } 
]] 
}); 
$("#test").datagrid('getPager').pagination({ 
showPageList: false, 
showRefresh: false, 
beforePageText: "第", 
afterPageText: "页 <a href='javascript：void(0)' onclick='GoEnterPage()'><img src='/upload/201109/20110920220555970.gif'></a>，共{pages}页", 
displayMsg: '当前{from}到{to}条，总共{total}条' 
}); 
}); //上面代码参数可以参看easyui的文档 
function GoEnterPage() { 
var e = jQuery.Event("keydown");//模拟一个键盘事件 
e.keyCode = 13;//keyCode=13是回车 
$("input.pagination-num").trigger(e);//模拟页码框按下回车 
} 
</script> 