How to get input type using jquery?

by

EDIT Feb 1, 2013. Due to the popularity of this answer and the changes to jQuery in version 1.9 (and 2.0) regarding properties and attributes, I added some notes and a fiddle to see how it works when accessing properties/attributes on input, buttons and some selects. The fiddle here: http://jsfiddle.net/pVBU8/1/

get all the inputs:

var allInputs = $(":input");

get all the inputs type:

allInputs.attr('type');

get the values:

allInputs.val();

NOTE: .val() is NOT the same as :checked for those types where that is relevent.
use:

.attr("checked");

EDIT Feb 1, 2013 – re: jQuery 1.9 use prop() not attr() as attr will not return proper values for properties that have changed.

.prop('checked');

or simply

$(this).checked;

to get the value of the check – whatever it is currently. or simply use the ‘:checked’ if you want only those that ARE checked.

EDIT: Here is another way to get type:

var allCheckboxes=$('[type=checkbox]');

EDIT2:
Note that the form of:

$('input:radio');

is perferred over 

$(':radio');

which both equate to:

$('input[type=radio]');

but the “input” is desired so it only gets the inputs and does not use the universal ‘*” when the form of $(':radio') is used which equates to $('*:radio');

EDIT Aug 19, 2015: preference for the $('input[type=radio]'); should be used as that then allows modern browsers to optimize the search for a radio input.

EDIT Feb 1, 2013 per comment re: select elements
@dariomac 

$('select').prop("type");

will return either “select-one” or “select-multiple” depending upon the “multiple” attribute and 

$('select')[0].type

returns the same for the first select if it exists. and 

($('select')[0]?$('select')[0].type:"howdy")

will return the type if it exists or “howdy” if it does not.

 $('select').prop('type');

returns the property of the first one in the DOM if it exists or “undefined” if none exist.

$('select').type

returns the type of the first one if it exists or an error if none exist.

More Related Contents:

  1. Why does the jquery change event not trigger when I set the value of a select using val()?
  2. jQuery ‘input’ event
  3. Full path from file input using jQuery
  4. jQuery – auto size text input (not textarea!) [duplicate]
  5. jquery input select all on focus
  6. jQuery: Get the cursor position of text in input without browser specific code? [duplicate]
  7. How do I implement onchange of with jQuery?
  8. What’s the difference between keyup, keydown, keypress and input events?
  9. How to empty input field with jQuery
  10. Detect changed input text box
  11. How to check if all inputs are not empty with jQuery
  12. jQuery autocomplete for dynamically created inputs
  13. Find all unchecked checkboxes in jQuery
  14. jQuery change placeholder text color
  15. Force a checkbox to always submit, even when unchecked
  16. How to get a table cell value using jQuery?
  17. jQuery disable a link
  18. What is fastest children() or find() in jQuery?
  19. val() doesn’t trigger change() in jQuery
  20. JQuery ui – date picker, disabling specific dates
  21. Unobtrusive validation in Chrome won’t validate with dd/mm/yyyy
  22. Is there a way to disable initial sorting for jquery DataTables?
  23. How do you stop Chrome and Opera sorting JSON objects by Index ASC?
  24. Remember which tab was active after refresh
  25. jQuery $(“.class”).click(); – multiple elements, click event once
  26. jQuery: this.attr() not a function?
  27. Jquery how to bind click event on dynamically created elements?
  28. Is there a callback for Twitter’s Tweet Button?
  29. Benefits of using attr() over addClass in jquery
  30. Jquery to open Bootstrap v3 modal of remote url

Leave a Comment