检查输入的类型是否为“文本/数字/电子邮件/等”？

Question

我需要使用 Javascript（不是 jQuery）检查给定的输入元素是否可由用户使用键盘写入。

我想排除复选框、单选按钮、按钮、重置、提交、图像等。

有没有一种简单的方法可以在不列出所有输入类型的情况下完成？

这是我现在的代码：

if (element.getAttribute === undefined) {
    return false;
}

var eTag  = element.tagName;
var eType = element.getAttribute('type');
var isTextInput = (eTag === 'INPUT' || eTag === 'TEXTAREA') && ( eType !== null || eType === 'text' || eType === 'password');
var isEnabledInput = element.disabled === false && element.readOnly === false;
var isContentEditable = ( element.contentEditable && element.contentEditable === true );

// stop for enabled text inputs, selects and contentEditable areas
return (isTextInput && isEnabledInput) || eType === 'SELECT' || isContentEditable;

逻辑上

&& ( eType !== null || eType === 'text' || eType === 'password');

不足以检查全部。

Answer 1

将此作为答案发布，因为解决了问题，但这并不是我所要求的。

我仍在等待更清洁的解决方案。

var notTextual = [
    'button',
    'checkbox',
    'hidden',
    'image',
    'radio',
    'reset',
    'submit'
];

if (element.getAttribute === undefined) {
    return false;
}

var eTag  = element.tagName;
var eType = element.getAttribute('type');
var isTextInput = (eTag === 'INPUT' || eTag === 'TEXTAREA') && !notTextual.contains(eType);
var isEnabledInput = element.disabled === false && element.readOnly === false;
var isContentEditable = ( element. isContentEditable && element. isContentEditable === true );

// stop for enabled text inputs, selects and contentEditable areas
return (isTextInput && isEnabledInput) || eType === 'SELECT' || isContentEditable;

Answer 2

如果您想根据输入类型调用函数，请创建一个包含所需输入类型的数组，另一个包含类型函数的数组并执行循环。

function GetInputType(e){ // e = element
   var Types=[
      "text",
      "password"
   ],
   Attr=e.getAttribute("type"),
   Actions=[
      function(){alert("It's text.")},
      function(){alert("It's password.")}
   ],
   Call=function(){alert("Unknown type.")};
   for(var i=0,l=Types.length;i<l;i++){
      !function(i){
         if(Attr==Types[i])
            Call=Actions[i];
         else break
      }(i)
   }
   Call()
}

Answer 3

我认为你需要自己写一些东西。您要求的业务逻辑比您想象的更具体。

• text

  是文字。

• number

  是文本，但输入必须是0-9，并且是十进制。

• password

  是文本输入，屏幕上显示黑色圆圈或类似内容。
• 单选按钮当然可以通过键盘输入。文本不会显示，但

  password

  也是如此。此外，输入本质上是“是”或“否”，但这只是对键盘输入功能的限制，就像

  number

  是对键盘输入功能的限制一样。

所以你想要类似...

• 键盘至少有部分时候可以输入...
• 并且文本必须显示在屏幕上，除非它是密码...
• 并且应该接受更多的输入，而不仅仅是单选按钮或复选框中的“空格”或“输入”

这不是一个标准的 HTML 修饰符，或标准的 jQuery，或任何东西。这就是你自己的业务逻辑。

我知道这不是答案，但我认为有充分的理由相信您不会在某个地方找到您正在寻找的开箱即用的东西。这取决于您自己的应用程序的逻辑，正是您所说的“文本”的含义。