javascript 如何使输入字段maxlength工作从键盘?

tsm1rwdh  于 2023-01-11  发布在  Java
关注(0)|答案(1)|浏览(135)

得到了一个输入字段,有一个最大长度为6,当键入正常工作正常,但当我尝试使用我做的键盘,它没有。它似乎只是绕过限制,如果它甚至不存在。
超文本:

<div class="bank-screen">
  <h1>Please enter your pin to continue</h1>
  <div class="options">
    <input name="pin" oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
    type = "number"
    maxlength = "4"
    id="pinfield">
  </div>
  <div class="keypad">
    <div class="keys">   
    <button value="1" class="key" onclick="GetNum(this)">1</button>
    <button value="2" class="key" onclick="GetNum(this)">2</button>
    <button value="3" class="key" onclick="GetNum(this)">3</button>
    <button value="4" class="key" onclick="GetNum(this)">4</button>
    <button value="5" class="key" onclick="GetNum(this)">5</button>
    <button value="6" class="key" onclick="GetNum(this)">6</button>
    <button value="7" class="key" onclick="GetNum(this)">7</button>
    <button value="8" class="key" onclick="GetNum(this)">8</button>
    <button value="9" class="key" onclick="GetNum(this)">9</button>
    <button class="key"></button>
    <button value="0" class="key" onclick="GetNum(this)">0</button>
    <button class="key"></button>
    <button class="key" id="submit">Submit</button>
    <button class="key" id="cancel">Cancel</button>
    <button class="key" id="clear" onclick="clearall()">Clear</button>
  </div>
</div>

联森:

function GetNum(a){
var pinfield = document.getElementById("pinfield");
pinfield.value = pinfield.value + a.value;

}

function clearall(){
var pinfield = document.getElementById("pinfield");
pinfield.value = null;

}

var result = 103/50;
result = Math.floor(result);

console.log(result);
jjjwad0x

jjjwad0x1#

通过JavaScript设置输入值似乎会忽略长度限制。
在您的情况下,可以在GetNum函数中添加一些验证,只在当前值少于4个字符时添加到输入字段。

function GetNum(a){
  var pinfield = document.getElementById("pinfield");
  if (pinfield.value.length < 6) {
    pinfield.value = pinfield.value + a.value;
  }
}

相关问题