在工作中许多时候需要考虑到用户体验,当按下回车键时切换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. python轻松实现代码编码格式转换

    python轻松实现代码编码格式转换 最近刚换工作不久,没太多的时间去整理工作中的东西,大部分时间都在用来熟悉新公司的业务,熟悉他们的代码框架了,最主要的是还有很多新东西要学,我之前主要是做php后台 ...

  2. 如何从ST官网下载STM32标准库

    Frm:https://blog.csdn.net/k1ang/article/details/79645044

  3. 剑指offer第二版面试题6:重建二叉树(JAVA版)

    题目:输入某二叉树的前序遍历和中序遍历的结果,请重新构造出该二叉树.假设输入的前序遍历和中序遍历的结果中不包含重复的数字.例如输入的前序遍历序列为{1,2,4,7,3,5,6,8}和中序遍历为{4,7 ...

  4. 进程共享变量#pragma data_seg用法

    #pragma data_seg介绍 用#pragma data_seg建立一个新的数据段并定义共享数据,其具体格式为: #pragma data_seg ("shareddata" ...

  5. [已解决]windows安装docker的问题

    windows下载安装docker出现的问题 进入powershell后输入docker --version报错: could not read CA certificate "C:\\Us ...

  6. IDEA下将dubbo简单项目跑Demo(2019.12版)

    项目架构(聚合项目,父子模块) src没用,所以删去 选择maven项目,不用勾选模板骨架,直接main方法,因为不用到服务器 顺序是按照:添加pom依赖-接口实现类-配置文件 项目环境 IDE:In ...

  7. 【转】elasticsearch中字段类型默认显示{ "foo": { "type": "text", "fields": { "keyword": {"type": "keyword", "ignore_above": 256} }

    官方原文链接:https://www.elastic.co/cn/blog/strings-are-dead-long-live-strings 转载原文连接:https://segmentfault ...

  8. 一键获取Android的appActvity和PackName

    大家平常写Appium自动化时,可能写脚本半小时,得有5分钟用来去看Activity,大部分都是通过adb命令的方式来获取.为了提高效率,可以把这个命令放到python里去执行,然后根据规则去筛选出自 ...

  9. 异步action和redux-thunk理解

    异步action一般指的就是异步action创建函数 action创建函数分为同步action创建函数和异步action创建函数 同步action创建函数(最常见的): function reques ...

  10. PD ZD

    PD TO ZD simple one without . SORT FIELDS,,PD,A,,,PD,A) OUTREC FIELDS,,PD,ZD,LENGTH, ,,PD,ZD,LENGTH, ...