jquery模拟按下回车实现代码


Posted in Javascript onSeptember 20, 2011

简单地记下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的按钮做跳转。好吧,客户是上帝,他们怎么说我们这些程序猿只能尽自己所能来达到效果。如图:

                                jquery模拟按下回车实现代码

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

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

<input class="pagination-num" type="text" value="1" size="2">

而后查看了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>

easyui官网:http://www.jeasyui.com/index.php
jquery:http://jquery.com/
这里有个jquery的中文手册,说明很全:http://jquery.org.cn/manual/
Javascript 相关文章推荐
JavaScript小技巧 2.5 则
Sep 12 Javascript
JQueryEasyUI Layout布局框架的使用
Apr 08 Javascript
jquery实现手风琴效果实例代码
Nov 15 Javascript
javascript实现获取服务器时间
May 19 Javascript
jquery实现网页的页面平滑滚动效果代码
Nov 02 Javascript
探究Javascript模板引擎mustache.js使用方法
Jan 26 Javascript
浅析C/C++,Java,PHP,JavaScript,Json数组、对象赋值时最后一个元素后面是否可以带逗号
Mar 22 Javascript
浅谈angularjs $http提交数据探索
Jan 20 Javascript
jQuery实现广告条滚动效果
Aug 22 jQuery
Vue实现动态创建和删除数据的方法
Mar 17 Javascript
javascript严格模式详解(含严格模式与非严格模式的区别)
Nov 12 Javascript
Postman环境变量全局变量使用方法详解
Aug 13 Javascript
一个分享按钮的插件使用介绍(可扩展,内附开发制作流程)
Sep 19 #Javascript
50个比较实用jQuery代码段
Sep 18 #Javascript
最新的10款jQuery内容滑块插件分享
Sep 18 #Javascript
Jquery 表格合并的问题分享
Sep 17 #Javascript
当jQuery遭遇CoffeeScript的时候 使用分享
Sep 17 #Javascript
jquery blockUI 遮罩不能消失与不能提交的解决方法
Sep 17 #Javascript
ExtJs Excel导出并下载IIS服务器端遇到的问题
Sep 16 #Javascript
You might like
献给php初学者(入门学习经验谈)
2010/10/12 PHP
Yii2框架引用bootstrap中日期插件yii2-date-picker的方法
2016/01/09 PHP
php微信开发之自定义菜单实现
2016/11/18 PHP
PHP随机生成中文段落示例【测试网站内容时使用】
2020/04/26 PHP
不间断滚动JS打包类,基本可以实现所有的滚动效果,太强了
2007/12/08 Javascript
js常见表单应用技巧
2008/01/09 Javascript
关于JS控制代码暂停的实现方法分享
2012/10/11 Javascript
ExtJS4利根据登录后不同的角色分配不同的树形菜单
2014/05/02 Javascript
js实现编辑div节点名称的方法
2014/12/17 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
2015/03/14 Javascript
JavaScript实现MIPS乘法模拟的方法
2015/04/17 Javascript
基于jquery实现即时检查格式是否正确的表单
2016/05/06 Javascript
原生js三级联动的简单实现代码
2016/06/07 Javascript
Bootstrap中的表单验证插件bootstrapValidator使用方法整理(推荐)
2016/06/21 Javascript
正则中的回溯定义与用法分析【JS与java实现】
2016/12/27 Javascript
js实现兼容PC端和移动端滑块拖动选择数字效果
2017/02/16 Javascript
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
2017/06/13 jQuery
微信小程序 同步请求授权的详解
2017/08/04 Javascript
React和Vue中监听变量变化的方法
2018/11/14 Javascript
浅谈JavaScript中你可能不知道URL构造函数的属性
2020/07/13 Javascript
python学习 流程控制语句详解
2016/06/01 Python
简单掌握Python中glob模块查找文件路径的用法
2016/07/05 Python
Python 使用os.remove删除文件夹时报错的解决方法
2017/01/13 Python
python 将json数据提取转化为txt的方法
2018/10/26 Python
django 实现编写控制登录和访问权限控制的中间件方法
2019/01/15 Python
使用 Django Highcharts 实现数据可视化过程解析
2019/07/31 Python
opencv 获取rtsp流媒体视频的实现方法
2019/08/23 Python
简单了解如何封装自己的Python包
2020/07/08 Python
单位门卫岗位职责
2013/12/20 职场文书
最新奶茶店创业计划书范文
2014/02/08 职场文书
《鸟岛》教学反思
2014/04/26 职场文书
船舶工程技术专业求职信
2014/08/07 职场文书
2014年教师节国旗下讲话稿
2014/09/10 职场文书
机关驾驶员违规检讨书
2014/09/13 职场文书
学习型家庭事迹材料
2014/12/20 职场文书
2016年九九重阳节活动总结
2016/04/01 职场文书