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

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

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

原代码为:<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 前端

推荐文章

pin.gl是基于WebRTC的屏幕共享工具
2024-11-19 06:38:05 +0800 CST
Linux查看系统配置常用命令
2024-11-17 18:20:42 +0800 CST
H5抖音商城小黄车购物系统
2024-11-19 08:04:29 +0800 CST
pip安装到指定目录上
2024-11-17 16:17:25 +0800 CST
Nginx 防止IP伪造,绕过IP限制
2025-01-15 09:44:42 +0800 CST
开源AI反混淆JS代码:HumanifyJS
2024-11-19 02:30:40 +0800 CST
php指定版本安装php扩展
2024-11-19 04:10:55 +0800 CST
Vue3中如何实现插件?
2024-11-18 04:27:04 +0800 CST
如何实现生产环境代码加密
2024-11-18 14:19:35 +0800 CST
使用 node-ssh 实现自动化部署
2024-11-18 20:06:21 +0800 CST
Vue3中哪些API被废弃了?
2024-11-17 04:17:22 +0800 CST
jQuery中向DOM添加元素的多种方法
2024-11-18 23:19:46 +0800 CST
程序员茄子在线接单