原生按字数多少自动切换焦点

最新推荐文章于 2023-08-02 18:38:29 发布

swrd2014

最新推荐文章于 2023-08-02 18:38:29 发布

阅读量210

点赞数

分类专栏： HTML/CSS JS

本文链接：https://blog.csdn.net/u014041540/article/details/79037363

版权

JS 同时被 2 个专栏收录

35 篇文章 0 订阅

订阅专栏

HTML/CSS

34 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>自动切换焦点</title>
		
	</head>
	<body>
		<form>
			<input type="text" placeholder="name" id='name' maxlength="3"/>
			<input type="text" placeholder="password" id='password' maxlength="6"/>
			<input type="text" placeholder="confirmPassword" id='confirm' maxlength="6"/>
		</form>
		<script>
			(function(){
				function focusForwad(event){
					
					var target = event.target;
					if(target.value.length === target.maxLength) {
						let form = target.form;
						for(let i =0 ;i < form.elements.length; i++ ){
							if(form.elements[i] === target){
								if(form.elements[i+1]){
									form.elements[i+1].focus();
								}
								return
							}
						}
					}
					
				}
				let name = document.getElementById('name');
				let password = document.getElementById('password');
				let confirm= document.getElementById('confirm');
				name.addEventListener('keyup',function(e){
					focusForwad(e);
				})
				password.addEventListener('keyup',function(e){
					focusForwad(e);
				})
				confirm.addEventListener('keyup',function(e){
					focusForwad(e);
				})
				
			})()
		</script>
	</body>
</html>

swrd2014

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
原生按字数多少自动切换焦点

自动切换焦点 (function(){ function focusForwad(event){ var target = event.target; if(target.value.length === target.maxLength) { let form = target.fo
复制链接

扫一扫