js input框输入1位数字后自动跳到下一个input框聚焦
// 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框聚焦的更多相关文章
- C#按回车Enter使输入焦点自动跳到下一个TextBox的方法收集
在录入界面中,用户往往需要按回车键时光标自动跳入下一个文本框,以方便录入操作.在C#中实现该功能有多种方法,以下是小编收集的不使用TAB键,而直接用回车键将光标转到下一个文本框的实现方法. 一.利用W ...
- 类似智能购票的demo--进入页面后默认焦点在第一个输入框,输入内容、回车、right时焦点自动跳到下一个,当跳到select时,下拉选项自动弹出,并且可以按上下键选择,选择完成后再跳到下一个。
要实现的效果:进入页面后默认焦点在第一个输入框,输入内容.回车.right时焦点自动跳到下一个,当跳到select时,下拉选项自动弹出,并且可以按上下键选择,选择完成后再跳到下一个. PS:自己模拟的 ...
- input text输完自动跳到下一个
应用场景: 短信验证码输入 效果: input输入框,输入完以后自动跳转到下一个 思路: 四个输入框 进入聚焦到第一个输入框 第一个输入框输完一个字符后自动聚焦到下一个输入框 1.四个输入框 < ...
- jQuery控制input只能输入两位数字和小数(金额)
function num(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字"和". ...
- input输入框修改后自动跳到最后一个字符
<input class="m-form-control" onpaste="return false" placeholder="直播间名称& ...
- 页面上有3个输入框:分别为max,min,num;三个按钮:分别为生成,排序,去重;在输入框输入三个数字后,先点击生成按钮,生成一个数组长度为num,值为max到min之间的随机整数点击排序,对当前数组进行排序,点击去重,对当前数组进行去重。 每次点击之后使结果显示在控制台
<!DOCTYPE html> <html> <head> <!-- 页面上有3个输入框:分别为max,min,num:三个按钮:分别为生成,排序,去重: 在 ...
- 验证码输入自动聚焦下一个input或者删除自动聚焦上一个input
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- JS n秒后自动跳转实例
<p><a href="<?php echo base_url();?>usercenter/index" id="message" ...
- js实现网页多少秒后自动跳转到指定网址
在网上搜了一下,关于这个技术处理有多种方法,我只记下我在视频里学到的三种: 1.用一个response.sendRedirect("目标页面.jsp\.htm");实现直接跳转: ...
随机推荐
- c#如何将子窗体显示到父窗体的容器(panel)控件中
如何将一个窗体显示到一个容器控件中,刚开始想的比较简单,用窗体容器控件添加一般控件的方法,试了一试,代码如下: Form2 frm = new Form2(); this.panel1.Control ...
- 好用的js-cookies工具
背景 回顾一年前的代码,关于cookies这块,增删改查完全可以封装成一个模块.在MDN上看到一款很全的分享,在此做个记录. cookies模块 /*\ |*| |*| :: cookies.js : ...
- Unable to load script from assets 'index.android.bundle' 出错?
野路子太多,坑人真的!F**k 言归正传,当你运行 react native 程序的时候出现这个错误 ,如果您使用Windows,请按以下方式运行命令,或者如果出现错误“无法找到条目文件index.a ...
- 【小程序】返回顶部wx.pageScrollTo和scroll-view的对比
一.wx.pageScrollTo(https://mp.weixin.qq.com/debug/wxadoc/dev/api/scroll.html) 1. 小程序中双击顶部的textbar.会默认 ...
- MS SQL Server数据库查询优化技巧
[摘 要]本文主要是对MS SQL Server数据库查询优化技巧进行了说明和分析,对索引使用.查询条件以及数据表的设计等进行了阐述.中国论文网 http://www.xzbu.com/2/view- ...
- atitit.js 与c# java交互html5化的原理与总结.doc
atitit.js 与c# java交互html5化的原理与总结.doc 1. 实现html5化界面的要解决的策略1 1.1. Js交互1 1.2. 动态参数个数1 1.3. 事件监听2 2. sen ...
- Pycharm Html CSS JS 快捷方式创建元素
div#div1>ol>li.id*4 tab键 <div id="div1"> <ol> <li id="id"&g ...
- RESET MASTER和RESET SLAVE使用场景和说明
[前言]在配置主从的时候经常会用到这两个语句,刚开始的时候还不清楚这两个语句的使用特性和使用场景. 经过测试整理了以下文档,希望能对大家有所帮助: [一]RESET MASTER参数 功能说明:删除所 ...
- 远程连接MySQL服务器
在CentOS虚拟机上安装好了MySQL服务以后,在windows上用Workbench客户端去连接时碰到很多问题,现在把解决过程记录一下. 1.在Windows上ping CentOS IP是可以p ...
- 动态展开tableView的cell[2]
动态展开tableView的cell[2] http://code4app.com/ios/%E5%8A%A8%E6%80%81%E6%B7%BB%E5%8A%A0cell/53845f8a933bf ...