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库 开发规则
Jan 31 Javascript
使用jquery prev()方法找到同级的前一个元素
Jul 11 Javascript
VUEJS实战之利用laypage插件实现分页(3)
Jun 13 Javascript
JavaScript实现简单的日历效果
Sep 25 Javascript
js控制一个按钮是否可点击(可使用)disabled的实例
Feb 14 Javascript
实例解析js中try、catch、finally的执行规则
Feb 24 Javascript
jQuery插件Echarts实现的双轴图效果示例【附demo源码下载】
Mar 04 Javascript
js禁止表单重复提交
Aug 29 Javascript
微信小程序之分享页面如何返回首页的示例
Mar 28 Javascript
详解webpack模块加载器兼打包工具
Sep 11 Javascript
JavaScript实现公告栏上下滚动效果
Mar 13 Javascript
手把手教你实现 Promise的使用方法
Sep 02 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
ajax 的post方法实例(带循环)
2011/07/04 PHP
PHP循环结构实例讲解
2014/02/10 PHP
php中in_array函数用法探究
2014/11/25 PHP
PHP 数组基本操作方法详解
2016/06/17 PHP
php基于websocket搭建简易聊天室实践
2016/10/24 PHP
模拟多级复选框效果的jquery代码
2013/08/13 Javascript
javascript间隔定时器(延时定时器)学习 间隔调用和延时调用
2014/01/13 Javascript
js实现带按钮的上下滚动效果
2015/05/12 Javascript
Bootstrap CSS组件之按钮下拉菜单
2016/12/17 Javascript
JS实现复选框的全选和批量删除功能
2017/04/05 Javascript
js时间戳与日期格式之间转换详解
2017/12/11 Javascript
如何给element添加一个抽屉组件的方法步骤
2019/07/14 Javascript
JavaScript HTML DOM元素 节点操作汇总
2019/07/29 Javascript
写了个监控nginx进程的Python脚本
2012/05/10 Python
在Python中操作文件之truncate()方法的使用教程
2015/05/25 Python
python3监控CentOS磁盘空间脚本
2018/06/21 Python
对Python 窗体(tkinter)树状数据(Treeview)详解
2018/10/11 Python
python找出完数的方法
2018/11/12 Python
Python解析、提取url关键字的实例详解
2018/12/17 Python
浅谈pytorch grad_fn以及权重梯度不更新的问题
2019/08/20 Python
Python递归调用实现数字累加的代码
2020/02/25 Python
python实现文字版扫雷
2020/04/24 Python
Keras自定义IOU方式
2020/06/10 Python
Python3爬虫中关于中文分词的详解
2020/07/29 Python
美国网上眼镜商城:Zenni Optical
2016/11/20 全球购物
英国在线花园中心:You Garden
2018/06/03 全球购物
男女钓鱼靴和甲板鞋:XTRATUF
2021/01/09 全球购物
护理专业毕业生自我鉴定
2013/10/08 职场文书
迎新晚会主持词
2014/03/24 职场文书
个人遵守党的政治纪律情况对照检查材料
2014/09/26 职场文书
作风整顿剖析材料
2014/09/30 职场文书
英语复习计划
2015/01/19 职场文书
2016父亲节感恩话语
2015/12/09 职场文书
2016领导干部廉洁自律心得体会
2016/01/13 职场文书
分享几种python 变量合并方法
2022/03/20 Python
Ruby处理CSV数据方法详解
2022/04/18 Ruby