2012-01-15 140 views
16

我意識到了這一點:如何使輸入字段同時輸入數字和密碼?

<input type="tel"> 

,我意識到這一點:

<input type="password"> 

但我想同時使用。我想讓數字小鍵盤在iOS上出現(特別是),但在鍵入後隱藏每個字符。是這樣的可能嗎?

<input type="tel|password"> 
+2

這應該是你的工作:http://stackoverflow.com/a/8334379/947898。 – uadrive 2012-01-15 18:38:39

回答

1

您可以輸入輸入密碼,然後使用javascript驗證在按下提交按鈕時僅輸入了數字。 http://www.configure-all.com/javascript_form_validation.php

+1

這也是我的回答,但似乎OP希望啓用一些通常由'type =「tel」'觸發的特定於iOS的UI功能。我不認爲JS輸入驗證將有助於這一點。 – 2012-01-15 21:55:53

+0

答案鏈接不再有效。什麼是更新的鏈接來幫助? – Whitecat 2017-10-24 18:28:08

8

輸入框的HTML:

<input type="tel" name="password" id="password" value="" placeholder="Enter password" 
    onfocus="changeToPassword()"> 

的Javascript:

// change the type of the input to password 
function changeToPassword() { 
    setTimeout(function() { 
     document.getElementById("password").setAttribute("type", "password") 
    }, 500); 
} 

此解決方案適用於iPhone上。這是一種黑客。一旦你在接下來的500毫秒內擁有數字鍵盤,你可以將attribut更改爲密碼,並且可以欺騙手機。

+2

這不會再工作。在有人輸入信息並模糊並嘗試重新輸入信息後,現在該類型已設置爲密碼,數字鍵盤不會來。 – Fyre 2014-10-14 03:55:46

15

在iOS設備上,你可以設置輸入輸入「密碼」,並使用HTML5的屬性還是觸發數字鍵盤的「模式」:

<input type="password" pattern="[0-9]*" ... /> 

Apple-Documentation

要顯示數字鍵盤,將pattern屬性的值設置爲「[0-9] 」或「\ d」。

+0

這個答案被低估了,並且更好地完成了被問到的問題,特別是在iOS中。 – 2014-05-01 17:37:19

+3

不幸的是,它不適用於Android – SILENT 2015-12-03 20:45:31

+2

這不適用於iOS,至少iOS9。將類型設置爲密碼會使模式和inputmode屬性無效。 – cduguet 2016-01-22 18:38:44