查找输入元素的“类型”答案

【问题标题】：Finding the 'type' of an input element查找输入元素的“类型”
【发布时间】：2021-04-05 23:11:59
【问题描述】：

我希望能够使用 JavaScript 在页面上查找某些内容的类型。问题如下：我需要检查特定区域是否是复选框/单选按钮/或文本字段。

如果它是一个复选框或单选按钮，它没有长度（其中没有字符串），否则如果它是一个文本字段，我需要检查它是否包含字符。该页面是动态创建的，因此有时会显示一个复选框，有时会显示一个文本字段。

所以我的想法是找到输入的类型，然后确定要做什么。

任何建议将不胜感激。

【问题讨论】：

没什么大不了的，但在这里应该进行更仔细的区分：“输入元素的类型”与“变量的类型”或“其他元素的类型”大不相同页”。

标签： javascript

【解决方案1】：

检查type 属性。这样就够了吗？

【讨论】：

像 element.type 一样使用它，它会返回 textarea 如果元素是 textarea 等等。
如果一个元素是输入，那么.type将返回text、checkbox、radio等。
HTMLInputElement.type，更准确地说。

【解决方案2】：

如果要检查表单中输入的类型，请使用以下代码：

<script>
    function getFind(obj) {
    for (i = 0; i < obj.childNodes.length; i++) {
        if (obj.childNodes[i].tagName == "INPUT") {
            if (obj.childNodes[i].type == "text") {
                alert("this is Text Box.")
            }
            else if (obj.childNodes[i].type == "checkbox") {
                alert("this is CheckBox.")
            }
            else if (obj.childNodes[i].type == "radio") {
                alert("this is Radio.")
            }
        }
        if (obj.childNodes[i].tagName == "SELECT") {
            alert("this is Select")
        }
    }
}
</script>     

<script>    
    getFind(document.myform);  
</script>

【讨论】：

你不必再使用那些 cmets：dorward.me.uk/www/comments-cdata

【解决方案3】：

如果您使用 jQuery，您可以轻松检查任何元素的类型。

    function(elementID){    
    var type = $(elementId).attr('type');
    if(type == "text") //inputBox
     console.log("input text" + $(elementId).val().size());
   }

同样，您可以检查其他类型并采取适当的措施。

【讨论】：

或者，如果你使用Javascript，你可以写document.getElementById(elementId).type。在这种情况下，我看不到 jQuery 带来的好处。
这是一个函数（意味着开销），采用非 jQuery 样式（例如，不是 .getType()，没有函数名并且仅执行 $(element)[0].type（假设您已经拥有jQuery 对象）

【解决方案4】：

检查输入类型

<!DOCTYPE html>
<html>
<body>

    <input type=number id="txtinp">
    <button onclick=checktype()>Try it</button>

    <script>
        function checktype() 
        {
            alert(document.getElementById("txtinp").type);
        }
    </script>

</body>
</html>

【讨论】：