Android端密码输入框：如何同时实现8字符限制与自动转大写？

直接修改脚本，在同一个事件处理函数中同时处理自动转大写和长度截断逻辑即可，同时避免事件冲突：

1. 调整后的输入框代码（移除原onkeyup属性） #

<input type="text" id="password" name="password" class="inputField" placeholder=" Password" 
minlength="8" maxlength="8" 
onfocus="this.placeholder = ''" onblur="this.placeholder = ' Password'" 
oninvalid="this.setCustomValidity('Please Enter Password')" oninput="setCustomValidity('')" 
required="">

2. 修改后的脚本逻辑 #

var elInput = document.getElementById('password');
var maxLength = elInput.maxLength;

// 用input事件替代keyup，适配更多Android输入法场景
elInput.oninput = function(e){
    // 第一步：将输入内容转为全大写
    this.value = this.value.toUpperCase();
    // 第二步：截断到最大允许长度
    if(this.value.length > maxLength){
        this.value = this.value.substring(0, maxLength);
    }
};

关键修改说明 #

• 把转大写和长度限制逻辑合并到同一个事件处理函数中，避免原input标签的onkeyup与脚本中的onkeyup互相覆盖
• 改用oninput事件替代onkeyup：部分Android输入法不会触发keyup事件，input事件会在输入内容变化时立即触发，兼容性更好
• 保留input标签的maxlength和minlength属性，作为浏览器原生的基础限制，脚本作为Android端的补充增强

内容的提问来源于stack exchange，提问作者user8322896