jQuery实现的回车触发按钮事件功能示例


Posted in jQuery onMarch 25, 2018

本文实例讲述了jQuery实现的回车触发按钮事件功能。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"/>
  <title>3water.com jQuery回车触发按钮事件</title>
  <script src="jquery-1.4.2.min.js" type="text/javascript"></script>
  <script language="javascript" type="text/javascript">
    $(function () {
      $('#Submit').click(function () {
        var account = $('#AccountInput').val();
        var password = $('#PasswordInput').val();
        if (account == '') {
          alert('Please input account.');
          $('#AccountInput').focus();
          return false;
        }
        if (password == '') {
          alert('Please input password.');
          $('#PasswordInput').focus();
          return false;
        }
        if (account == 'chad' && password == '123456') {
          alert('Login success.');
        }
        else {
          alert('Login failed.');
        }
      });
      $(document).keydown(function (event) {
        if (event.keyCode == 13) {
          $('#Submit').triggerHandler('click');
        }
      });
    });
  </script>
</head>
<body>
  <form id="form1" runat="server">
  <div>
    <table>
      <tr>
        <td> account</td>
        <td><input id="AccountInput" type="text" style="width: 150px;" /></td>
      </tr>
      <tr>
        <td>password</td>
        <td><input id="PasswordInput" type="text" style="width: 150px;" /></td>
      </tr>
      <tr>
        <td><input id="Submit" type="button" value="submit"/></td>
      </tr>
    </table>
  </div>
  </form>
</body>
</html>

运行效果:

jQuery实现的回车触发按钮事件功能示例

PS:关于javascript事件说明可参考本站javascript事件与功能说明大全:http://tools.3water.com/table/javascript_event

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
利用jquery正则表达式在页面验证url网址输入是否正确
Apr 04 jQuery
jQuery实现div跟随鼠标移动
Aug 20 jQuery
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例
Aug 04 jQuery
使用jQuery实现页面定时弹出广告效果
Aug 24 jQuery
jQuery动态添加.active 实现导航效果代码思路详解
Aug 29 jQuery
基于jQuery的$.getScript方法去加载javaScript文档解析
Nov 08 jQuery
Jquery遍历筛选数组的几种方法和遍历解析json对象,Map()方法详解以及数组中查询某值是否存在
Jan 18 jQuery
原生JS forEach()和map()遍历的区别、兼容写法及jQuery $.each、$.map遍历操作
Feb 27 jQuery
详解JQuery基础动画操作
Apr 12 jQuery
JQuery常用简单动画操作方法回顾与总结
Dec 07 jQuery
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
Feb 01 jQuery
9种方法优化jQuery代码详解
Feb 04 jQuery
jQuery+Cookie实现切换皮肤功能【附源码下载】
Mar 25 #jQuery
jQuery实现新闻播报滚动及淡入淡出效果示例
Mar 23 #jQuery
jquery的 filter()方法使用教程
Mar 22 #jQuery
浅谈jquery fullpage 插件增加头部和版权的方法
Mar 20 #jQuery
jQuery替换节点元素的操作方法
Mar 18 #jQuery
jquery 实现拖动文件上传加载进度条功能
Mar 18 #jQuery
jQuery中each方法的使用详解
Mar 18 #jQuery
You might like
PHP统计nginx访问日志中的搜索引擎抓取404链接页面路径
2014/06/30 PHP
php+mysqli使用面向对象方式更新数据库实例
2015/01/29 PHP
php使用post数组的键值创建同名变量并赋值的方法
2015/04/03 PHP
PHP文件后缀不强制为.php方法
2019/03/31 PHP
javascript的对话框详解与参数
2007/03/08 Javascript
asp.net和asp下ACCESS的参数化查询
2008/06/11 Javascript
ExtJS 2.0实用简明教程 之Ext类库简介
2009/04/29 Javascript
JS 无法通过W3C验证的处理方法
2010/03/09 Javascript
理解Javascript_11_constructor实现原理
2010/10/18 Javascript
了解jQuery技巧来提高你的代码(个人觉得那个jquery的手册很不错)
2012/02/10 Javascript
判断滚动条到底部的JS代码
2013/11/04 Javascript
jQuery使用removeClass方法删除元素指定Class的方法
2015/03/26 Javascript
js实现顶部可折叠的菜单工具栏效果实例
2015/05/09 Javascript
JS实现样式清新的横排下拉菜单效果
2015/10/09 Javascript
vue.js入门教程之基础语法小结
2016/09/01 Javascript
利用JS实现页面删除并重新排序功能
2016/12/09 Javascript
Vue.js 2.0窥探之Virtual DOM到底是什么?
2017/02/10 Javascript
NodeJS实现视频转码的示例代码
2017/11/18 NodeJs
JavaScript原型对象原理与应用分析
2018/12/27 Javascript
微信小程序tabBar 返回tabBar不刷新页面
2019/07/25 Javascript
jQuery实现可编辑的表格
2019/12/11 jQuery
jQuery中event.target和this的区别详解
2020/08/13 jQuery
Python MySQLdb Linux下安装笔记
2015/05/09 Python
Python 判断奇数偶数的方法
2018/12/20 Python
Python设计模式之外观模式实例详解
2019/01/17 Python
Python操作Word批量生成合同的实现示例
2020/08/28 Python
网页切图的CSS和布局经验与要点
2015/04/09 HTML / CSS
BIBLOO波兰:捷克的一家在线服装店
2018/03/09 全球购物
波兰在线运动商店:YesSport
2020/07/23 全球购物
趣味体育活动方案
2014/02/08 职场文书
父母寄语大全
2014/04/12 职场文书
董事长助理岗位职责
2015/02/11 职场文书
深入理解java.lang.String类的不可变性
2021/06/27 Java/Android
通过T-SQL语句创建游标与实现数据库加解密功能
2022/03/16 SQL Server
【海涛七七解说】DCG第二周:DK VS 天禄
2022/04/01 DOTA
升级 Win11 还是坚守 Win10?微软 Win11 新系统缺失功能大盘点
2022/04/05 数码科技