// input框输入1位数字后自动跳到下一个input聚焦
function goNextInput(el){
var txts = document.querySelectorAll(el);
for(var i = 0; i<txts.length;i++){
var t = txts[i];
t.index = i;
t.setAttribute("readonly", true);
t.onkeyup=function(){
this.value=this.value.replace(/^(.).*$/,'$1');
var next = this.index + 1;
if(next > txts.length - 1) return;
txts[next].removeAttribute("readonly");
if (this.value) {
txts[next].focus();
} }
}
txts[0].removeAttribute("readonly");
}

调用如下:goNextInput('.code-num');

js input框输入1位数字后自动跳到下一个input框聚焦的更多相关文章

  1. C#按回车Enter使输入焦点自动跳到下一个TextBox的方法收集

    在录入界面中,用户往往需要按回车键时光标自动跳入下一个文本框,以方便录入操作.在C#中实现该功能有多种方法,以下是小编收集的不使用TAB键,而直接用回车键将光标转到下一个文本框的实现方法. 一.利用W ...

  2. 类似智能购票的demo--进入页面后默认焦点在第一个输入框,输入内容、回车、right时焦点自动跳到下一个,当跳到select时,下拉选项自动弹出,并且可以按上下键选择,选择完成后再跳到下一个。

    要实现的效果:进入页面后默认焦点在第一个输入框,输入内容.回车.right时焦点自动跳到下一个,当跳到select时,下拉选项自动弹出,并且可以按上下键选择,选择完成后再跳到下一个. PS:自己模拟的 ...

  3. input text输完自动跳到下一个

    应用场景: 短信验证码输入 效果: input输入框,输入完以后自动跳转到下一个 思路: 四个输入框 进入聚焦到第一个输入框 第一个输入框输完一个字符后自动聚焦到下一个输入框 1.四个输入框 < ...

  4. jQuery控制input只能输入两位数字和小数(金额)

    function num(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字"和". ...

  5. input输入框修改后自动跳到最后一个字符

    <input class="m-form-control" onpaste="return false" placeholder="直播间名称& ...

  6. 页面上有3个输入框:分别为max,min,num;三个按钮:分别为生成,排序,去重;在输入框输入三个数字后,先点击生成按钮,生成一个数组长度为num,值为max到min之间的随机整数点击排序,对当前数组进行排序,点击去重,对当前数组进行去重。 每次点击之后使结果显示在控制台

    <!DOCTYPE html> <html> <head> <!-- 页面上有3个输入框:分别为max,min,num:三个按钮:分别为生成,排序,去重: 在 ...

  7. 验证码输入自动聚焦下一个input或者删除自动聚焦上一个input

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. JS n秒后自动跳转实例

    <p><a href="<?php echo base_url();?>usercenter/index" id="message" ...

  9. js实现网页多少秒后自动跳转到指定网址

    在网上搜了一下,关于这个技术处理有多种方法,我只记下我在视频里学到的三种: 1.用一个response.sendRedirect("目标页面.jsp\.htm");实现直接跳转: ...

随机推荐

  1. mysql 查询每秒写入数据库的记录数

    SELECT * from t_user ORDER BY create_time desc SELECT create_time,  COUNT(create_time) as num from t ...

  2. Docker for Windows(四)实践搭建&删除MySQL服务

    我们已经下载安装好了Docker for Windows:Docker for Windows(一)下载与安装,也简单了解了Docker常用命令:Docker for Windows(三)Docker ...

  3. bootstrap前端框架使用总结分享

    1.bootstrap 排版 全局样式style.css: 1.移除body的margin声明 2.设置body的背景色为白色 3.为排版设置了基本的字体.字号和行高 4.设置全局链接颜色,且当链接处 ...

  4. FineReport中JS如何自定义按钮导出

    FineReport支持多种不同的导出方式,直接使用FineReport内置导出按钮可以非常快捷方便的来对各种格式的输出,但是我们在web页面集成中的时候,往往只想将报表内容嵌入到iframe中,而工 ...

  5. 异度之刃 Xenoblade 后感

    WII版重置的N3DS劣化版异度之刃终于通关了.在出色的自制系统的快乐NTR的帮助下,充分体验到了神作的剧情史诗感. 关于游戏的玩法系统,从现在来看8年前的游戏,缺点显而易见,特别是跑地图这回事,地图 ...

  6. 前端构建工具 Gulp.js 上手实例

    在软件开发中使用自动化构建工具的好处是显而易见的.通过工具自动化运行大量单调乏味.重复性的任务,比如图像压缩.文件合并.代码压缩.单元测试等等,可以为开发者节约大量的时间,使我们能够专注于真正重要的. ...

  7. ORACLE查询表最近更改的数据 VERSIONS BETWEEN TIMESTAMP MINVALUE AND MAXVALUE

    转自 http://blog.chinaunix.net/uid-8504518-id-3325718.html 今天开发人员问我如何快速并方便的查出一张表最近被更改的记录,这个需求很简单,由于是查最 ...

  8. BootStrap selectpicker后台动态绑定数据

    项目使用BootStrap设置select时,不能动态加载,使用以下方法可以解决. //获得全部订单信息(订单ID,订单名称) function GetAllOrders(obj) { $.ajax( ...

  9. LeetCode 题解之Minimum Index Sum of Two Lists

    1.题目描述 2.问题分析 直接是用hash table 解决问题 3.代码 vector<string> findRestaurant(vector<string>& ...

  10. PLSQL中使用二维存储结构---二维数组

    代码如下:  --PLSQL中没有数组的概念 用TYPE 和Table of Record来代替多维数组--create by jenrry 20171028-- 1.0 建立存放列的测试表creat ...