javascript实现依次输入input自动定焦
作者:bea
代码如下: <html> <head> <script type="text/javascript"> function moveNext(object,index){ if(object.value.length==4){ document.forms[0].elements[index+1].focus(); } } function showResult(){ var f=doc
代码如下:
<html>
<head>
<script type="text/javascript">
function moveNext(object,index){
if(object.value.length==4){
document.forms[0].elements[index+1].focus();
}
}
function showResult(){
var f=document.forms[0];
var result="";
for(var i=0;i<4;i++){
result+=f.elements[i].value;
}
alert(result);
}
</script>
</head>
<body onload="document.forms[0].elements[0].focus();">
<form>
<input type="text" size="3" maxlength="4" onkeyup="moveNext(this,0);">
<input type="text" size="3" maxlength="4" onkeyup="moveNext(this,1);">
<input type="text" size="3" maxlength="4" onkeyup="moveNext(this,2);">
<input type="text" size="3" maxlength="4" onkeyup="moveNext(this,3);">
<input type="button" value="显示" onclick="showResult();">
</form>
</body>
</html>
代码很简单,功能非常实用,小伙伴们美化下就可以用到自己项目中了,是不是很炫酷
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- 使用javascript获取页面名称
- jQuery类选择器用法实例
- 基于JQuery制作可编辑的表格特效
- JavaScript调试工具汇总
- jQuery制作简洁的多级联动Select下拉框
- jQuery元素选择器用法实例
- jquery制作漂亮的弹出层提示消息特效
- 使用jQuery仿苹果官网焦点图特效
- jQuery分组选择器用法实例
- jQuery后代选择器用法实例
- 浅析Javascript中“==”与“===”的区别
- javascript实现微信分享
- JSON取值前判断
- jQuery基础语法实例入门
- jQuery回调函数的定义及用法实例
- jQuery中odd选择器的定义和用法
- 浅析javascript 定时器
- JavaScript中自定义事件用法分析
- jQuery中even选择器的定义和用法