当前位置: 首页 > 编程笔记 >

javascript实现依次输入input自动定焦

郏稳
2023-03-14
本文向大家介绍javascript实现依次输入input自动定焦,包括了javascript实现依次输入input自动定焦的使用技巧和注意事项,需要的朋友参考一下


<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>

代码很简单,功能非常实用,小伙伴们美化下就可以用到自己项目中了,是不是很炫酷

 类似资料:
  • Desktop Note: Keyboard, joystick and gamepad input works only on the desktop version of Unity. 注意:键盘,操纵杆和游戏手柄输入仅工作于Unity桌面版本。 Unity supports keyboard, joystick and gamepad input. Unity支持,键盘,操纵杆和游戏手柄输入

  • 本文向大家介绍Android实现动态自动匹配输入内容,包括了Android实现动态自动匹配输入内容的使用技巧和注意事项,需要的朋友参考一下 Android实现动态自动匹配的控件主要有MultiAutoCompleteTextView和AutoCompleteTextView MultiAutoCompleteTextView: 可支持选择多个值(在多次输入的情况下),分别用分隔符分开,并且在每个值

  • import { Input } from 'feui'; components: { [Input.name]: Input } 代码演示 基础用法 <fe-group> <fe-input title='value' v-model="value" placeholder="我是占位符"></fe-input> </fe-group> 不可用状态 <fe-group

  • 输入框组件。 Usage 全部引入 import { Input } from 'beeshell'; 按需引入 import { Input } from 'beeshell/dist/components/Input'; Examples iOS 平台 Android 平台支持清空功能 Code 详细 Code import { Input } from 'beeshell'; <Inp

  • Input 输入框 通过鼠标或键盘输入字符 warning Input 为受控组件,它总会显示 Vue 绑定值。 通常情况下,应当处理 input 事件,并更新组件的绑定值(或使用v-model)。否则,输入框内显示的值将不会改变。 不支持 v-model 修饰符。 基础用法 demo <el-input v-model="input" placeholder="请输入内容"></el-input

  • radio-group 单项选择器,内部由多个<radio/>组成。 bindchange 类型:EventHandle 默认值:无 说明:<radio-group/> 中的选中项发生变化时触发 change 事件,event.mp.detail = {value: 选中项radio的value} radio 单选项目 在mpvue框架中使用 <template> <div class="pa