javascript - 试图强制特定的文本框重写

Question

我无意中发现了这个特定的代码，虽然我发现它功能齐全，但我试图挑剔它的几个部分以使其更加用户友好。也就是说，我试图在每个文本框中强制设置一些值。

第一个文本框应该是一个纯二进制文本框，只允许 0 和 1。第二个和第四个文本框应该是八进制和十六进制的。我的问题是，如何强制重写这些文本框？我想说的是，我正在寻找一个属性或事件，如果它与我在文本框中想要的不匹配，它会删除我的输入。

如果我在二进制文本框中键入一个字母或数字，它应该被删除。 如果我在八进制文本框中键入大于 7 的数字或字母，则会被删除。 十六进制 = 除了 A-F 之外没有其他字母。对于十进制，没有字母。我知道如何使用 and if 和其他命名法排除这些值，但在为每个文本框执行此操作时我真的迷路了。

这是代码:

    window.onload = id;


function id(id) {
  return document.getElementById(id);
}
function Convert(s, n)
 {
  if(parseInt(id(s).value, n)) 
  {
    if("bin" != s) { id("bin").value = parseInt(id(s).value, n).toString(2) }
    if("oct" != s) { id("oct").value = parseInt(id(s).value, n).toString(8) }
    if("dec" != s) { id("dec").value = parseInt(id(s).value, n).toString(10) }
    if("hex" != s) { id("hex").value = parseInt(id(s).value, n).toString(16) }
  } else 
  {
    if("bin" != s) { id("bin").value = "" }
    if("oct" != s) { id("oct").value = "" }
    if("dec" != s) { id("dec").value = "" }
    if("hex" != s) { id("hex").value = "" }

  }
 }

Answer 1

使用 onkeyup事件以监听用户在输入框中所做的更改。

您可以使用 REGEX 表达式检查输入框中的字符串是否仅包含 0 和 1。如果不是，则删除最后输入的字母:

const check = e => {
  const value = e.target.value
  const isBinary = /^[0,1]+$/.test(value)
  
  if(!isBinary) {
    
    e.target.value = value.substring(0, value.length - 1);
  
  }

}

<input onkeyup="check(event)">

如果 value 仅包含 ，/^[0,1]+$/.test(value) 将返回 true 0 和/或 1，否则将返回 false。