编程 html5 输入密码时改键盘样式为数字键盘

2024-11-18 06:51:04 +0800 CST views 3367

今天接到老板的需求,登录密码的时候需要弹出手机键盘。

原代码为:<input type="password">

#解决方案一:

<input type="tel" class="password" maxlength="6" pattern="[0-9]*" />

你以为解决了?没有这里虽然会弹出数字键盘 但是输入是明文的。所以我们需要继续优化一下

<style>
input[type="tel" i].password {
    -webkit-text-security: disc;
}
</style>

事情完美解决了.

password.jpg

苹果和安卓都测试通过了。

另外还有一种方法

<input type="password" pattern="[0-9]*" onkeyup="this.value=this.value.replace(/\D/g,'');" onafterpaste="this.value=this.value.replace(/\D/g,'');">
复制全文 生成海报 js 前端

推荐文章

Hypothesis是一个强大的Python测试库
2024-11-19 04:31:30 +0800 CST
html流光登陆页面
2024-11-18 15:36:18 +0800 CST
程序员出海搞钱工具库
2024-11-18 22:16:19 +0800 CST
前端如何一次性渲染十万条数据?
2024-11-19 05:08:27 +0800 CST
html一个全屏背景视频
2024-11-18 00:48:20 +0800 CST
H5保险购买与投诉意见
2024-11-19 03:48:35 +0800 CST
PHP服务器直传阿里云OSS
2024-11-18 19:04:44 +0800 CST
MySQL 1364 错误解决办法
2024-11-19 05:07:59 +0800 CST
Golang中国地址生成扩展包
2024-11-19 06:01:16 +0800 CST
PHP 允许跨域的终极解决办法
2024-11-19 08:12:52 +0800 CST
html夫妻约定
2024-11-19 01:24:21 +0800 CST
服务器购买推荐
2024-11-18 23:48:02 +0800 CST
聚合支付管理系统
2025-07-23 13:33:30 +0800 CST
Go 语言实现 API 限流的最佳实践
2024-11-19 01:51:21 +0800 CST
PHP 命令行模式后台执行指南
2025-05-14 10:05:31 +0800 CST
程序员茄子在线接单