今天在做一个类似IP输入框的时候遇到一个不大不小的麻烦!在我使用onkeyup事件的时候程序运行了我所预料之外的结果,把代码贴在这里,看看是问题出在那里。有解决方案的把代码贴上大家共享,谢谢了!
<!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 http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script>
function keyJump1(obj){
if(obj.length==4) {
document.all.personNumber2.focus();
}
}
function keyJump2(obj){
if(obj.length==6) document.all.personNumber3.focus();
}
function keyJump3(obj){
if(obj.length==8) document.all.personNumber4.focus();
}
</script>
<body>
<table border="0">
<tr>
<td><input name="personNumber1" type="text" class="textbox" style=" width:030; height:20 " onfocus="this.select()" onkeyup='keyJump1(this.value)' maxlength="4"></td>
<td width="005">-</td>
<td ><input name="personNumber2" type="text" class="textbox" style=" width:040; height:20" onfocus="this.select()" onkeyup='keyJump2(this.value)' maxlength="6"></td>
<td width="005">-</td>
<td ><input name="personNumber3" type="text" class="textbox" style=" width:055; height:20" onfocus="this.select()" onkeyup='keyJump3(this.value)' maxlength="8"></td>
<td width="005">-</td>
<td ><input name="personNumber4" type="text" class="textbox" style=" width:010; height:20" onfocus="this.select()" onkeyup='' maxlength="1"></td>
</tr>
</table>
</body>
</html>
这张页面按我最初的设计是在判断前一个输入框已输入符合长度的值时自动跳到下一个输入框,并将输入框内的内容选中。在输入框都为空的情况下能正常运行,但当输入框都填满后,回到第一个输入框或第二个输入框,再对值进行修改时就出现问题了,如:在第一输入框输入四个字符后,焦点并不是跳到第二个输入框,却跳到了第三个输入框,似乎是在第二个输入框自动激发了一次onkeyup事件,但这应该不是代码中的错误。郁闷,谢谢各位指点迷津!
分享到:
相关推荐
主要介绍了中文输入法不触发onkeyup事件的解决办法,需要的朋友可以参考下
* onKeyUp:当键盘上某个按键被按放开时触发的事件 页面相关事件 * onAbort:图片在下载时被用户中断 * onBeforeUnload:当前页面的内容将要被改变时触发的事件 * onError:捕抓当前页面因为某种原因而出现的错误...
onkeypress和onkeydown以及onkeyup的区别onkeypress和onkeydown以及onkeyup的区别onkeypress和onkeydown以及onkeyup的区别
8.4.2 onkeyup事件 172 8.4.3 onkeypress事件 172 第9章 JavaScript和cookie 173 9.1 建立第一个cookie 173 9.2 读取cookie 176 9.3 显示cookie 177 9.4 使用cookie作为计数器 178 9.5 删除cookie ...
《JavaScript》——Event 对象与事件 Event 对象是 JavaScript 中的一个基本概念,它代表了用户与 Web 页面的交互行为,例如点击、鼠标移动、键盘输入等。Event 对象的属性和方法可以帮助开发者更好地处理用户的...
这一章包含了在 JavaScript客户端用于激发某些特定动作的事件对象和事件句柄。另外,本章还包括了关于使用事件和事件句柄的常规信息。 关于事件常规信息 定义事件句柄 Navigator 4.0 中的事件 event onAbort onBlur ...
Javascript事件键码查找器 找出javascript的OnKeyDown,OnKeyUp和OnKeyPress事件调用的键码的简单工具。 现场演示: :
这个JavaScript的关键是onChange()事件,使用onKeyUp()事件完成是不行的,人家没有输入完毕,你就说人家不对,多不友好啊╮(╯▽╰)╭ 一、基本目标 一个表单认证页,如果输入的用户名超过10位则会立即在输入框旁边...
实时代码编辑器 我构建了一个实时代码编辑器。 我学习了如何使用iframe广告代码。 我还学习了如何使用JavaScript事件监听器onkeyup编写HTML,CSS和JavaScript的值并编译结果。
起初用js 的onkeyup事件,但始终没能触发。该事件不知道别的什么地方监视了,js的事件有传递,也可以阻断,蛮麻烦,情况太多。找了好久,终于找到了一种解决方案,通过onpropertychange事件可以迎刃而解。 代码如下:...
记事本直播使用onkeyup事件在服务器中自动同步的notpad应用程序。 在package.json目录中运行“ npm install”,然后运行app.js为使应用程序正常运行,必须在端口6379上运行redis服务器运行“ node app.js”以在您的...
浅析OnKeyPress事件和OnKeyDown、OnKeyUp事件
昨天群里面的朋友问了个比较有意思的问题,keydown,keyup,keypress事件的先后顺序。
这个属性用于 onkeydown、onkeypress 和 onkeyup 事件。 offsetX 属性 offsetX 属性用于返回鼠标在事件源元素中的 X 坐标。语法:event.offsetX 注释:这是个只读属性。 offsetY 属性 offsetY 属性用于返回鼠标在...
本文实例分析了javascript中键盘事件用法。分享给大家供大家参考。具体如下: 键盘事件包含onkeydown、onkeypress和onkeyup这三个事件 事件初始化 function keyDown(){} [removed] = keyDown; //论按下键盘上的哪个...
JavaScript权威指南 犀牛书 Chapter 1. Introduction to JavaScript Section 1.1. JavaScript Myths Section 1.2. Versions of JavaScript Section 1.3. Client-Side JavaScript Section 1.4. JavaScript ...
本框里输入的时候要开始计算文本框里面输入了多少字,自然想到了onkeydown事件,然后计算value.length的方法,下面看下具体的代码
字数统计功能,原理是给textarea添加onKeyup事件,事件读取textarea内容并获得长度,并赋值给统计字数的那个文本节点,这里有一点要注意的是添加onKeypress和onKeydown事件也能实现效果,但都有些不足,会在某些情况...