在工作中许多时候需要考虑到用户体验，当按下回车键时切换input选框就来得十分必要。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>按下回车键时自动切换焦点</title>
<style type="text/css">
.style1 {color: #FFFFFF}
.wenbenkuang {
font-family: "宋体";
font-size: 9pt;
color: #333333;
border: 1px solid #999999;
}
</style>
 
</head>
<body style="font-size:12px">
<table width="547" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
  <td height="8"></td>
  </tr>
  <tr>
  <td valign="top"><table width="532" border="0" align="center" cellpadding="0" cellspacing="0">
  <form name="form1">
  <tr>
  <td height="27" colspan="2" align="left" class="font_white">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="style1">用户注册</span></td>
  </tr>
  <tr>
  <td width="172" height="22" align="right">用户名称:</td>
  <td width="328" height="22"><input name="用户名称" type="text" class="wenbenkuang" id="用户名称" maxlength="50" onKeyPress="Myenter(form1.密码)" /></td>
  </tr>
  <tr>
  <td height="22" align="right">密
  码:</td>
  <td height="22"><input name="密码" type="password" class="wenbenkuang" maxlength="50" onKeyPress="Myenter(form1.真实姓名)" /></td>
  </tr>
  <tr>
  <td height="22" align="right">真实姓名:</td>
  <td height="22"><input name="真实姓名" type="text" class="wenbenkuang" id="真实姓名" size="30" maxlength="50" onKeyPress="Myenter(form1.联系方式)" /></td>
  </tr>
  <tr>
  <td height="22" align="right">联系方式:</td>
  <td height="22"><input name="联系方式" type="text" class="wenbenkuang" id="联系方式" size="30" maxlength="30" onKeyPress="Myenter(form1.Email)" /></td>
  </tr>
  <tr>
  <td height="22" align="right">E-mail:</td>
  <td height="22"><input name="Email" type="text" class="wenbenkuang" id="Email" size="30" maxlength="100" onKeyPress="Myenter(form1.add)"/></td>
  </tr>
  <tr>
  <td height="22" colspan="2" align="center"><input name="add" type="button" class="button" id="add" value="提 交" onClick="form1.submit();" />
&nbsp;
  <input type="reset" name="Submit2" value="重 置" class="button" /></td>
  </tr>
  </form>
  </table></td>
  </tr>
  <tr>
  <td height="8" ></td>
  </tr>
</table>
<script type="text/javascript">
function Myenter(str){
//判断是否点击回车，是的话str获取焦点
  if (event.keyCode == 13){
  str.focus();}
}
</script>
</body>
</html>

回车切换input选框的更多相关文章

  1. jquery 复选框全选/全不选切换 普通DOM元素点击选中/取消选中切换

    1.要选中的复选框设置统一的name 用prop() prop() 方法设置或返回被选元素的属性和值. $("#selectAll").click(function(){ $(&q ...

  2. css input checkbox复选框控件 样式美化的多种方案

    checkbox复选框可能是网站中常用的html元素,但大多数人并不满意它的默认样式,这篇文章就讲讲如何实现input checkbox复选框控件 样式美化效果. 资源网站大全 https://55w ...

  3. 自定义常用input表单元素一：纯css 实现自定义checkbox复选框

    最下面那个是之前写的  今天在做项目的时候发现,之前写的貌似还是有点多,起码增加的span标签可以去掉,这样保持和原生相同的结构最好的,仅仅是样式上的变化.今天把项目中的这个给更新上来.下面就直接还是 ...

  4. jquery点击复选框触发事件给input赋值

    体验效果:http://keleyi.com/keleyi/phtml/jqtexiao/31.htm 代码如下: <!DOCTYPE html> <html xmlns=" ...

  5. 关于复选框input[type=checkbox]

    关于复选框input[type=checkbox],其实在前面的文章中说过一次,当时主要关注点在设置复选框的状态,利用prop实现,今天继续关注一下复选框. 自己在项目中,遇到一个全选/全不选的需求, ...

  6. input单选框全选与反选

    input单选框全选与反选 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  7. 关于bootstrap--表单（下拉<select>、输入框<input>、文本域<textare>复选框<checkbox>和单选按钮<radio>）

    html 里面的 role 本质上是增强语义性,当现有的HTML标签不能充分表达语义性的时候,就可以借助role来说明.通常这种情况出现在一些自定义的组件上,这样可增强组件的可访问性.可用性和可交互性 ...

  8. 前端 HTML form表单标签 input标签 type属性 checkbox 多选框

    多选框 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  9. input标签（单选框和复选框）

    单选框: <form> <input type="radio" name="..." value="..." checke ...

随机推荐

  1. 面向对象（四）——classmethod、staticmethod装饰器（绑定方法与非绑定方法）

    classmethod.staticmethod装饰器 一.绑定方法与非绑定方法 1.绑定方法(绑定给谁,谁来调用就自动将它本身当作第一个参数传入): (1) 绑定到类的方法:用classmethod ...

  2. eduCF#61 F. Clear the String /// 区间DP 消除连续一段相同字符 全部消完的最少次数

    题目大意: 给定字符串 每次消除可消除连续的一段相同的字符的子串 求消除整个字符串的最少消除次数 #include <bits/stdc++.h> using namespace std; ...

  3. 如何让contenteditable元素只能输入纯文本

    本文出自张旭鑫博客,要知详情,请戳右侧地址:http://www.zhangxinxu.com/wordpress/?p=5120 一.温故而知新 很多年以前,稍等,让我搜一下contentedita ...

  4. canvas-nest.js 设置网页背景

    只需要在HTML,body中加如这行代码就可以实现效果,可以在color中修改颜色 <!DOCTYPE html> <html> <head> <meta c ...

  5. visual studio 2013下搭建 安卓，ios，wp app开发平台

    1.安装 visual studio 2013 + Microsoft Visual Studio 2013 Update 4+Microsoft Build Tools 2015 2.安装java ...

  6. 笔记-ubuntu中/home下中文目录改英文

    安装ubuntu后,如果选择的语言是中文,那/home下的文件夹会默认中文,在使用命令行的时候很不方便,此文记录切换成英文的方式,以便日后查看. 将目录重命名为英文 可以使用图形化界面,直接重命名 可 ...

  7. 从零开始搭建系统1.5——Redis安装及配置

    1.在/usr/目录下创建redis目录 [root@localhost usr]# mkdir redis 2.下载安装包 wget http://download.redis.io/release ...

  8. set -x 调试shell

    在上面的结果中,前面有“+”号的行是shell脚本实际执行的命令,前面有“++”号的行是执行trap机制中指定的命令,其它的行则是输出信息. shell的执行选项除了可以在启动shell时指定外,亦可 ...

  9. 试探回溯法（backtracking）

    一.八皇后问题 国际象棋中皇后的势力范围覆盖其所在的水平线.垂直线以及两条对角线.现考查如下问题:在n*n的棋盘上放置n个皇后,如何使得她们彼此互不攻击,此时称她们构成一个可行的棋局.对于任何整数n ...

  10. 22. 异常（Eception）

    1. 现实生活的病 现实生活中万物在发展和变化会出现各种各样不正常的现象. 1)例如:人的成长过程中会生病. |——病 |——不可治愈(癌症晚期) |——可治愈 |——小病自行解决(上火,牙痛) |— ...