jQuery实现的回车触发按钮事件功能示例
更新时间：2018年03月25日 10:45:16 作者：曹振华
这篇文章主要介绍了jQuery实现的回车触发按钮事件功能,涉及jQuery事件响应及页面元素属性动态操作相关实现技巧,需要的朋友可以参考下
本文实例讲述了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>www.jb51.net 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>
运行效果：
PS：关于javascript事件说明可参考本站javascript事件与功能说明大全：http://tools.jb51.net/table/javascript_event
更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery常见事件用法与技巧总结》、《jQuery常用插件及用法总结》、《jQuery操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
相关文章
本篇文章主要介绍了jQuery中的deferred对象和extend方法，具有很好的参考价值。下面跟着小编一起来看下吧2017-05-05
这篇文章主要介绍了jQuery操作元素追加内容,结合完整实例形式分析了jquery页面元素追加相关操作方法,包括append、appendTo、prepend、prependTo等方法使用技巧,需要的朋友可以参考下2020-01-01
第一次认识jquery延迟对象，这篇文章主要为大家详细解析JQ延迟对象的相关概念,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-10-10
这篇文章主要为大家详细介绍了jQuery Ajax上传文件的相关代码,需要的朋友可以参考下2016-03-03
这篇文章主要介绍了jquery实现弹出层效果的方法,实例分析了jQuery实现弹出层的技巧,涉及jQuery操作页面元素与样式的技巧,需要的朋友可以参考下2015-05-05
这篇文章主要为大家详细介绍了jQuery事件用法，具有一定的参考价值，感兴趣的朋友可以参考一下2016-10-10
这篇文章主要为大家详细介绍了用jQuery旋转插件jqueryrotate制作转盘抽奖，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-02-02
Jquery Easyui对话框组件Dialog使用详解（14）
这篇文章主要为大家详细介绍了Jquery Easyui对话框组件Dialog的使用方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
这篇文章主要介绍了JavaScript实现的滚动公告特效,结合完整实例形式详细分析了基于jQuery实现的页面元素间歇修改,最终达到滚动公告效果的相关操作技巧,需要的朋友可以参考下2019-07-07
自定义刻度jq进度条可以自定义进度条刻度圆点数量，大小等相关属性，可以通过css控制圆点的外观样式，通过progressdots插件自定义刻度动画，使用该插件还需引入jquery，jquery.progressdots.js和jquery.progressdots.css文件。需要的朋友一起学习吧2015-09-09
最新评论