首頁猿問在輸二分法士大夫

在輸二分法士大夫

JavaScript

erutdioup8556 2016-09-21 09:34:09

在輸入框輸入第一個跳轉(zhuǎn)到下一個后，邊框顏色會隨光標(biāo)變綠色，跟pc網(wǎng)頁支付寶輸入密碼那樣？怎么實(shí)現(xiàn)呢？""?/> ???? ????<form?class="form"> ????????<div?class="mui-input-row"> ????????????<input?type="tel"?id="tel"?class="hnb-input?mui-input-clear"?placeholder="請輸入您的手機(jī)號"?maxlength='11'?/> ????????????<span?class="hnb-icon?hnb-icon-user"></span> ????????</div> ????????<div?class="mui-input-row"> ????????????<input?type="password"?id="password"?class="hnb-input?mui-input-password"?placeholder="請?jiān)O(shè)置不少于6位數(shù)的密碼"?/> ????????????<span?class="hnb-icon?hnb-icon-password"></span> ????????</div>??? ??? <div?class="mui-popup?mui-popup-in"?style="display:?block;"> </html>

查看完整描述

2 回答

erutdioup8556

TA貢獻(xiàn)41條經(jīng)驗(yàn) 獲得超27個贊

input[type=text]:focus { border: 1px solid #587d18; }

反對回復(fù) 2016-09-21

stone310

TA貢獻(xiàn)361條經(jīng)驗(yàn) 獲得超191個贊

在這里添加了2個函數(shù)，看下是你要的效果嗎

var?inputtwArr?=?document.querySelectorAll(".inputw");
for(var?i?=?0,?j?=?inputtwArr.length;?i?<?j;?i++)?{
???inputtwArr[i].addEventListener("keyup",?function(e)?{
???????if(this.value?!==?"")?{
???????????this.nextSibling.nextElementSibling.focus();

???????????return?false;
???????}
???})
???inputtwArr[i].addEventListener("focus",function(){??//光標(biāo)放上去變淺綠色
???????this.style.borderColor="lightgreen"
???})
???inputtwArr[i].addEventListener("blur",function(){???//光標(biāo)移開回復(fù)正常
???????this.style.borderColor=""
???})
}

反對回復(fù) 2016-09-21