2011-11-30 29 views
22

Tôi đang tạo ứng dụng HTML5 trên Android và cho trường hợp cụ thể này, chúng tôi có trường nhập cho mã bảo mật của thẻ tín dụng và chúng tôi muốn buộc trường nhập chỉ được đánh số và đeo mặt nạ.Có cách nào để có trường nhập số được đeo mặt nạ không?

Tôi không may mắn tìm kiếm trường hợp cụ thể này và từ mọi thứ tôi có thể biết từ việc nghiên cứu/tự mình thử nghiệm là không thể thực hiện điều này hoàn toàn thông qua HTML5 (vì số và mật khẩu đều là tùy chọn cho loại và chỉ có thể sử dụng một loại). Tôi thiếu một cái gì đó và có một cách để bật lên bàn phím số trong khi có đầu vào được che giấu thông qua HTML5 hoặc là có một cách khác để buộc các loại đầu vào bàn phím hoặc che dấu đầu vào thông qua CSS hoặc JavaScript?

Cảm ơn bạn đã trợ giúp!

+0

Khi bạn nói 'hoàn toàn thông qua HTML5', bạn có thực sự có nghĩa là 'không có JavaScript' không? – robertc

+0

Tốt hơn là tôi chỉ muốn sử dụng các tham số của trường nhập; tuy nhiên tôi mở để sử dụng JavaScript. Giải pháp tiềm năng duy nhất tôi có thể nghĩ là mặc định trường để nhập số và trên sự kiện tiêu điểm thay đổi loại thành mật khẩu trong JS. Tôi đã không thử nghiệm nó vì vậy tôi không chắc làm thế nào Android sẽ xử lý đó. – JakeW

+0

@ user1074240, ý của bạn có phải là trường số pin không? Nếu vậy, hãy sử dụng trường 'mật khẩu', nhưng xác thực rằng giá trị phải là số. – zzzzBov

Trả lời

35

Nếu nó chỉ cần thiết để làm việc trong các trình duyệt WebKit dựa, và CSS được cho phép trong 'hoàn toàn thông qua HTML5', bạn có thể thử:

input[type=number] { 
    -webkit-text-security: disc; 
} 

Tôi không chắc chắn nếu có hiện bất kỳ tương đương cho các trình duyệt khác , trong tương lai, điều này có thể được kiểm soát thông qua appearance CSS property . Phiên bản CSS3 của appearance đã bị xóa khỏi thông số kỹ thuật, vì vậy có vẻ như bạn sẽ phải đợi tiêu chuẩn hóa text-security cho giải pháp trình duyệt chéo.

+0

Cảm ơn điều đó! làm việc tốt cho tình huống của tôi vì chúng tôi chỉ cần nó để làm việc trên Android – JakeW

+2

Cũng hoạt động trong một webview iPhone (ví dụ như ứng dụng PhoneGap) tất nhiên –

+0

Đã gần 5 năm rồi, nhưng tôi vẫn không thể tìm ra giải pháp nào tốt hơn Trong bất kỳ trình duyệt nào, có vẻ như không có gì được chuẩn hóa cho đến nay? –

Các vấn đề liên quan