JS按回车键实现登录的方法


Posted in Javascript onAugust 25, 2014

本文实例讲述了JS按回车键实现登录的方法,该功能有着非常广泛的实用价值。分享给大家供大家参考之用。具体方法如下:

方法一:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Check Score</title>
<script language="JavaScript">
function keyLogin(){
 if (event.keyCode==13)  //回车键的键值为13
   document.getElementByIdx_x("input1").click(); //调用登录按钮的登录事件
}
</script>
</head>
<body onkeydown="keyLogin();">
<input id="input1" value="登录" type="button" onClick="alert('调用成功!')">
</body>
</html>

方法二:

<script>
function KeyDown()
{
  if (event.keyCode == 13)
  {
    event.returnValue=false;
    event.cancel = true;
    Form1.btnsubmit.click();
  }
}
</script>

使用方法:

<form name="Form1" method="">
用户名:<INPUT TYPE=text SIZE=20 maxlength = 8 onkeydown=KeyDown()>
密码:<INPUT TYPE=password SIZE=20 maxlength = 8 onkeydown=KeyDown()>
<input type="submit" name="btnsubmit" value="提交" />
</form>

方法三:

任何一个网站页面都有登陆界面,很多时候在输入好用户名和密码后,还要用鼠标去点一个类似于登陆什么的按钮或者链接.这样你才能进网站做你喜欢做的事情.
有时候我就在想是不是能在输入好我该输入的东西后,直接敲回车就执行登陆功能呢?解决方法如下:

ss.html页面代码:

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" href="css/text.css" type="text/css">
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onkeydown="on_return();">
  <form name ="loginForm" method="post" action="fuck.html">        
   <table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
 <td width="69%" height="30"><span class="font_04">帐户名</span>
  <input type="text" name="userName" size="18.5">
 </td>
    </tr>
    <tr>
 <td width="69%" height="30"><span class="font_04">密 码</span>
  <input type="password" name="pwd" >
 </td>
    </tr>
    <tr>
 <td width="31%" height="30">
 <a id="sub" onClick='check()' >
 登陆</a></td>
    </tr>
   </table>
  </form>
</body>
</html>
<script language="javascript">
function check() {
    var formname=document.loginForm;
   if (formname.userName.value == "") {
    alert("请输入用户名!");
    formname.userName.focus();
    return false;
  }
  if (formname.pwd.value == "") {
    alert("请输入密码!");
    formname.pwd.focus();
    return false;
  }
  formname.submit();
}
  //回车时,默认是登陆
 function on_return(){
 if(window.event.keyCode == 13){
  if (document.all('sub')!=null){
   document.all('sub').click();
   }
 }
 }
</script>

此处注意:在<body>里面我们加了onkeydown属性,这样我们输入好内容后按键就可以直接执行JS方法on_return()了.因为window.event.keyCode 如果是13的话,表示回车键,所以我们判断我们按的键是不是回车键,如果是我们就去找'sub'属性,假如找到了执行click方法就是了。

希望本文所述方法对大家的web程序设计有所帮助。

Javascript 相关文章推荐
给moz-firefox下添加IE方法和属性
Apr 10 Javascript
Mootools 1.2教程(3) 数组使用简介
Sep 14 Javascript
Jquery Select操作方法集合脚本之家特别版
May 17 Javascript
Javascript Throttle &amp; Debounce应用介绍
Mar 19 Javascript
jquery 显示*天*时*分*秒实现时间计时器
May 07 Javascript
AngularJS基础学习笔记之指令
May 10 Javascript
JavaScript算法系列之快速排序(Quicksort)算法实例详解
Sep 04 Javascript
ES5 ES6中Array对象去除重复项的方法总结
Apr 27 Javascript
微信小程序数字滚动插件使用详解
Feb 02 Javascript
微信小程序使用echarts获取数据并生成折线图
Oct 16 Javascript
使用preload预加载页面资源时注意事项
Feb 03 Javascript
vue3.0实现插件封装
Dec 14 Vue.js
在JavaScript中重写jQuery对象的方法实例教程
Aug 25 #Javascript
一个支持任意尺寸的图片上下左右滑动效果
Aug 24 #Javascript
jquery 取子节点及当前节点属性值的方法
Aug 24 #Javascript
在JS数组特定索引处指定位置插入元素的技巧
Aug 24 #Javascript
js获取checkbox复选框选中的选项实例
Aug 24 #Javascript
jQuery异步加载数据并添加事件示例
Aug 24 #Javascript
Jquery通过JSON字符串创建JSON对象
Aug 24 #Javascript
You might like
PHP中使用smarty生成静态文件的例子
2014/04/24 PHP
PHP实现自动对图片进行滚动显示的方法
2015/03/12 PHP
PHP中header函数的用法及其注意事项详解
2016/06/13 PHP
thinkphp集成前端脚手架Vue-cli的教程图解
2018/08/30 PHP
PHP的mysqli_select_db()函数讲解
2019/01/23 PHP
如何利用PHP实现上传图片功能详解
2020/09/24 PHP
一个可以显示阴历的JS代码
2007/03/05 Javascript
从JavaScript的函数重名看其初始化方式
2007/03/08 Javascript
javascript 常用关键字列表集合
2007/12/04 Javascript
javascript权威指南 学习笔记之javascript数据类型
2011/09/24 Javascript
6款新颖的jQuery和CSS3进度条插件推荐
2013/03/05 Javascript
子窗体与父窗体传值示例js代码
2013/08/01 Javascript
CheckBoxList多选样式jquery、C#获取选择项
2013/09/06 Javascript
Bootstrap模态框案例解析
2017/03/05 Javascript
解决npm管理员身份install时出现权限的问题
2018/03/16 Javascript
JavaScript去掉数组重复项的方法分析【测试可用】
2018/07/19 Javascript
javascript合并两个数组最简单的实现方法
2019/09/14 Javascript
ionic2.0双击返回键退出应用
2019/09/17 Javascript
JS数据类型STRING使用实例解析
2019/12/18 Javascript
原生js+ajax分页组件
2020/01/30 Javascript
JavaScript实现点击切换验证码及校验
2021/01/10 Javascript
[03:46]显微镜下的DOTA2第七期——满血与残血
2014/06/20 DOTA
[58:15]2018DOTA2亚洲邀请赛 4.1 小组赛 A组 NB vs Liquid
2018/04/02 DOTA
python字符串对其居中显示的方法
2015/07/11 Python
python计算圆周率pi的方法
2015/07/11 Python
python os.path模块常用方法实例详解
2018/09/16 Python
django中的图片验证码功能
2019/09/18 Python
pytorch的梯度计算以及backward方法详解
2020/01/10 Python
python IP地址转整数
2020/11/20 Python
法国在线宠物店:zooplus.fr
2018/02/23 全球购物
介绍一下SOA和SOA的基本特征
2016/02/24 面试题
《沉香救母》教学反思
2014/04/19 职场文书
尊师重教演讲稿
2014/09/04 职场文书
2016年三严三实党课学习心得体会
2016/01/06 职场文书
django上传文件的三种方式
2021/04/29 Python
SQL基础的查询语句
2021/11/11 MySQL