How do I determine an HTML input element type upon an event using jQuery?

Question

Given the following sample code:

$(document).ready(function(){
    $(":input").blur(function(){
        alert("The input type is:" );  //How would this look??????
    })
});

How can I detemine whether this is an input, select, text, etc?

This is not a real-world example but should suffice for the purposes of this question

Answer 1

$(this).attr("type");

See jQuery's Selectors/Attribute documentation for additional information.

Answer 2

$(this).attr("type");

for example:

$(document).ready(function(){
    $("input").blur(function(){
        alert("The input type is:" + $(this).attr("type"));
    })
});

Answer 3

This should work...

$(document).ready(function(){
    $("input").blur(function(){
        var type = this.type;
        alert("The input type is:" + type);
    })
});

Answer 4

Why not go through and see what attribute/property would be most useful?

$(document).ready(function(){
    $("input").blur(function(){
        for (var x in this)
            alert(x + ":" + this[x]);
    })
});

Answer 5

How can I deteminedetermine whether this is an input, select, text, etc?

Note that select, textarea, "etc" elements are not covered by $('input'). You probably rather want to use $(':input') to get them all.

$(document).ready(function(){
    $(':input').blur(function(){
        alert('The tag is:' + this.tagName);
        if (this.tagName == 'INPUT') {
           alert("The input type is:" + $(this).attr('type'));
        }
    })
});