默認光標在第一個input框裏面,第一個輸入完光標默認到第二個input框,獲取驗證碼倒計時效果

默認光標在第一個input框裏面,第一個輸入完光標默認到第二個input框,獲取驗證碼倒計時效果

<!-- 驗證碼彈窗開始 -->
	<div class="vercodebox">
		<h4>手機驗證碼</h4>
		<p><em>已發送至159****4315手機號</em> <span>60s</span></p>
		<h5>
			<input type="text" maxlength="1"/>
			<input type="text" maxlength="1"/>
			<input type="text" maxlength="1"/>
			<input type="text" maxlength="1"/>
		</h5>
		<div class="btcz">
			<a class="aginbtn">重新獲取</a>
			<a class="Submittn">提交</a>
		</div>
	</div>
	<!-- 驗證碼錯誤開始 -->
//獲取驗證碼
var timer = null;
var count = 60;
$(".bannerbox .dzform .eachinput .yuyuebtn").click(function() {
	setfocus();
	$(".vercodebox").show();
	timer = setInterval("Timer()",1000);
});
$(".vercodebox .btcz .aginbtn").click(function() {
	$(".vercodebox .btcz .aginbtn").hide();
	clearInterval(timer);
	count = 60;
	$(".vercodebox p span").text(count + 's');
	timer = setInterval("Timer()",1000);
});
function Timer()
{
	count--;
	$(".vercodebox p span").text(count + 's');
	if (count <=0) {
		clearInterval(timer);
		$(".vercodebox .btcz .aginbtn").show();
	}
}

function setfocus(){
	var vercod = $(".vercodebox h5 input");    
	for(var i = 0; i<vercod.length;i++){
		var t = vercod[i];
		t.index = i;
		t.setAttribute("disabled", true);
		t.onkeyup=function(){
			this.value=this.value.replace(/^(.).*$/,'$1');
			var next = this.index + 1;
			if(next > vercod.length - 1) return;
			vercod[next].removeAttribute("disabled");
			vercod[next].focus();
		}
	}
	vercod[0].removeAttribute("disabled");
	setTimeout(function(){
   vercod[0].focus(); 
  },1);	
}

$(".vercodebox .btcz .Submittn").on('click',function(){                                   
	var v1 = $("input:eq(1)").val();
	var v2 = $("input:eq(2)").val();
	var v3 = $("input:eq(3)").val();
	var v4 = $("input:eq(4)").val();
	var str=v1+v2+v3+v4;
	alert(str);          
})
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章