在工作中许多时候需要考虑到用户体验,当按下回车键时切换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. Dubbo入门到精通学习笔记(八):ActiveMQ的安装与使用(单节点)、Redis的安装与使用(单节点)、FastDFS分布式文件系统的安装与使用(单节点)

    文章目录 ActiveMQ的安装与使用(单节点) 安装(单节点) 使用 目录结构 edu-common-parent edu-demo-mqproducer edu-demo-mqconsumer 测 ...

  2. jquery中的ajax方法参数的用法和他的含义

    jquery中的ajax方法参数的用法和他的含义: 1.url:  要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type:  要求为String类型的参数,请求方式(pos ...

  3. HDU 5119 Happy Matt Friends (背包DP + 滚动数组)

    题目链接:HDU 5119 Problem Description Matt has N friends. They are playing a game together. Each of Matt ...

  4. Java随机访问文件

    使用随机访问文件,我们可以从文件读取以及写入文件.使用文件输入和输出流的读取和写入是顺序过程.使用随机访问文件,可以在文件中的任何位置读取或写入.RandomAccessFile类的一个对象可以进行随 ...

  5. MySQL在Win10与Ubuntu下的安装与配置

        本文首发于cartoon的博客     转载请注明出处:https://cartoonyu.github.io/cartoon-blog     近段时间把自己电脑(win).虚拟机(Ubun ...

  6. python列表中enumerate和zip函数用法

    enumerate: 定义:enumerate() 函数用于将一个可遍历的数据对象(如列表.元组或字符串)组合为一个索引序列,同时列出数据和数据下标 例子: list1 =[89,98,00,75,6 ...

  7. MJExtension常用方法

    一.MJExtension第三方框架 我们在iOS开发过程中,我们常常需要将字典数据(也就是JSON数据)与Model模型之间的转化,例如网络请求返回的微博数据.等等,如果我们自己全部手动去创建模型并 ...

  8. DEV插件下的控件Grid和Gridlookupedit控件的结合使用

    创建GridlookupEtid控件 设置其对应属性: 设置属性 this.gridLookUpEdit1.Properties.TextEditStyle = DevExpress.XtraEdit ...

  9. 链表vector

    根据逻辑次序的复杂程度,大致可以将各种数据结构划分为线性结构.半线性结构与非线性结构三大类. 在线性结构中,各数据项按照一个线性次序构成一个整体.最为基本的线性结构统称为序列(sequence),根据 ...

  10. 【PKUWC2018】猎人杀

    题目描述 题目分析 设\(W=\sum\limits_{i=1}^nw_i\),\(A=\sum\limits_{i=1}^nw_i[i\ is\ alive]\),\(P_i\)为下一个打中\(i\ ...