嗨，我看你碰到了自定义数字键盘输入时绕开输入框maxlength限制的问题，别慌，咱们来理清楚问题根源然后解决它～

问题原因 #

你现在的限制逻辑是写在输入框的oninput事件里的，但通过自定义键盘按钮直接给输入框的value赋值时，并不会自动触发oninput事件，所以原来的长度校验代码根本没执行，自然就绕过了maxlength限制。另外提个小细节：你描述里说maxlength是6，但代码里写的是4，记得保持一致哦。

解决方案 #

这里给你两种可行的解决办法，你可以根据自己的需求选：

方法一：在键盘点击函数里直接做长度校验

这是最直接的方式，每次点击键盘按钮时，先检查输入框当前长度是否已经达到maxlength，只有没达到时才添加数字：

function GetNum(a){
    var pinfield = document.getElementById("pinfield");
    // 把maxlength转成数字类型（避免字符串比较出问题）
    const maxLength = parseInt(pinfield.maxLength);
    if (pinfield.value.length < maxLength) {
        pinfield.value = pinfield.value + a.value;
    }
}

方法二：手动触发输入框的input事件

如果你想复用原来写在oninput里的逻辑，可以在给输入框赋值后，手动触发input事件，这样原来的长度限制代码就会生效：

function GetNum(a){
    var pinfield = document.getElementById("pinfield");
    pinfield.value = pinfield.value + a.value;
    // 手动触发input事件，让oninput里的校验逻辑执行
    pinfield.dispatchEvent(new Event('input'));
}

额外小提示 #

输入框的type="number"对maxlength属性的兼容性其实不太好，有些浏览器会直接忽略这个属性。如果需要严格的长度限制，你可以考虑把type改成tel（同样能调出数字键盘），或者结合上面的JavaScript校验，这样兼容性会更好。

备注：内容来源于stack exchange，提问作者MotherDema