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 相关文章推荐
js 调用本地exe的例子(支持IE内核的浏览器)
Dec 26 Javascript
JQuery调用绑定click事件的3种写法
Mar 28 Javascript
jQuery实现仿路边灯箱广告图片轮播效果
Apr 15 Javascript
PhantomJS快速入门教程(服务器端的 JavaScript API 的 WebKit)
Aug 06 Javascript
一步一步封装自己的HtmlHelper组件BootstrapHelper(三)
Sep 14 Javascript
JS中BOM相关知识点总结(必看篇)
Nov 22 Javascript
JavaScript高阶函数_动力节点Java学院整理
Jun 28 Javascript
js实现本地时间同步功能
Aug 26 Javascript
React BootStrap用户体验框架快速上手
Mar 06 Javascript
vue 中 beforeRouteEnter 死循环的问题
Apr 23 Javascript
帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)
Aug 23 Javascript
使用js和canvas实现时钟效果
Sep 08 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
Discuz 模板引擎的封装类代码
2008/07/18 PHP
PHP中替换键名的简易方法示例详解
2014/01/07 PHP
封装ThinkPHP的一个文件上传方法实例
2014/10/31 PHP
php常用表单验证类用法实例
2015/06/18 PHP
浅谈PHP的数据库接口和技术
2016/12/09 PHP
laravel-admin select框默认选中的方法
2019/10/03 PHP
用js实现的一个Flash滚动轮换显示图片代码生成器
2007/03/14 Javascript
List the UTC Time on a Computer
2007/06/11 Javascript
页面中iframe相互传值传参
2009/12/13 Javascript
使用Jquery打造最佳用户体验的登录页面的实现代码
2011/07/08 Javascript
jquery 插件学习(二)
2012/08/06 Javascript
js事件冒泡实例分享(已测试)
2013/04/23 Javascript
原生javascript实现图片无缝滚动效果
2016/02/12 Javascript
详解Javascript ES6中的箭头函数(Arrow Functions)
2016/08/24 Javascript
基于AngularJS实现表单验证功能
2017/07/28 Javascript
基于js中this和event 的区别(详解)
2017/10/24 Javascript
vue-router 源码之实现一个简单的 vue-router
2018/07/02 Javascript
Angular4 组件通讯方法大全(推荐)
2018/07/12 Javascript
[46:28]EG vs Liquid 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.23
2019/09/05 DOTA
python实现的一个火车票转让信息采集器
2014/07/09 Python
从源码解析Python的Flask框架中request对象的用法
2016/06/02 Python
Python中防止sql注入的方法详解
2017/02/25 Python
详解python中 os._exit() 和 sys.exit(), exit(0)和exit(1) 的用法和区别
2017/06/23 Python
python去除文件中重复的行实例
2018/06/29 Python
详解Python的循环结构知识点
2019/05/20 Python
python求一个字符串的所有排列的实现方法
2020/02/04 Python
远程Wi-Fi宠物监控相机:Petcube
2017/04/26 全球购物
Aerosoles爱柔仕官网:美国舒软女鞋品牌
2017/07/17 全球购物
复古斯堪的纳维亚儿童服装:Baby go Retro
2017/09/09 全球购物
英国最大的汽车配件在线商店:Euro Car Parts
2019/09/30 全球购物
英国最大的在线快递公司之一:ParcelHero
2019/11/04 全球购物
OSPF有什么优点?为什么OSPF比RIP收敛快?
2013/02/13 面试题
工程项目经理岗位职责
2013/12/15 职场文书
综合实践活动总结
2014/05/05 职场文书
2014年关工委工作总结
2014/11/17 职场文书
工作汇报材料难写?方法都在这里了!
2019/07/01 职场文书