[javascript] Finding the 'type' of an input element

I'd like to be able to find the type of something on the page using javascript. The problem is as follows: I need to check whether a specific area is a checkbox/radio button/ or text field.

If its a checkbox or radio button it doesnt have a length(no strings in it) otherwise if its a textfield I need to check whether or not it contains characters. The page is created dynamically so sometimes a checkbox may be displayed other times a text field.

So my thinking is find the type of input, then determine what to do.

Any suggestions would be appreciated.

Thanks in advance.

This question is related to javascript

The answer is


Check the type property. Would that suffice?


To check input type

<!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> 

If you are using jQuery you can easily check the type of any element.

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

similarly you can check the other types and take appropriate action.


If you want to check the type of input within form, use the following code:

<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.")
            }
            if (obj.childNodes[i].type == "checkbox") {
                alert("this is CheckBox.")
            }
            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>