偶然間發(fā)現(xiàn)的一個(gè)小問(wèn)題，一個(gè)登錄功能的小頁(yè)面，只需要輸入賬號(hào)和密碼用來(lái)驗(yàn)證登錄用，很久才有人發(fā)現(xiàn)這個(gè)問(wèn)題，就是當(dāng)你輸入完賬號(hào)點(diǎn)擊輸入密碼的時(shí)候，光標(biāo)直接就聚焦在了密碼輸入框當(dāng)中，但是如果你再要從密碼輸入框點(diǎn)擊回到賬號(hào)輸入框，重新輸入賬號(hào)信息或者修改賬號(hào)信息的時(shí)候，就會(huì)發(fā)現(xiàn)，點(diǎn)一下沒(méi)得反應(yīng)，得再點(diǎn)一下才能聚焦，如下圖

當(dāng)我從輸入密碼框，點(diǎn)擊到輸入工號(hào)框的時(shí)候，直接失去焦點(diǎn)，無(wú)法直接輸入需要再次點(diǎn)擊才能繼續(xù)輸入。

其實(shí)代碼中并沒(méi)有出問(wèn)題，只是input框的type選擇出現(xiàn)了差異，導(dǎo)致這一情況的發(fā)生，這里面輸入的工號(hào)一般為純數(shù)字，我們的話(huà)type就直接用了number的屬性，其實(shí)使用number屬性沒(méi)有任何問(wèn)題，這里使用number或者tel都是可以方便用戶(hù)直接輸入工號(hào)的，但是我之前設(shè)置了number就會(huì)出現(xiàn)之前說(shuō)的這一幕，在密碼框回點(diǎn)到帳號(hào)框的時(shí)候，需要點(diǎn)兩下，而type設(shè)置成tel的話(huà)，直接就可以無(wú)縫切換很絲滑，所以沒(méi)有特殊要求的話(huà)，可以設(shè)置成tel來(lái)提高用戶(hù)的使用體驗(yàn)哦

最后說(shuō)一下type=number和type=tel的區(qū)別吧

在iOS中，input type="tel"和input type="number"是兩種不同的輸入類(lèi)型，它們有以下區(qū)別：

input type="tel"：此輸入類(lèi)型常用于電話(huà)號(hào)碼的輸入，鍵盤(pán)上會(huì)顯示與電話(huà)號(hào)碼輸入相關(guān)的特殊字符

input type="number"：此輸入類(lèi)型用于數(shù)值的輸入。它會(huì)限制用戶(hù)只能輸入數(shù)字，并且鍵盤(pán)上只顯示數(shù)字鍵盤(pán)。

總結(jié)input type="tel"適用于需要輸入電話(huà)號(hào)碼的場(chǎng)景，而input type="number"適用于需要輸入數(shù)值的場(chǎng)景