:checkbox JQ Home  <<  Selectors  <<  :checkbox

Form checkbox selector.

Shorthand version $(':checkbox')


The :checkbox selector, selects all elements of type checkbox.

Being a jQuery extension the :checkbox pseudo selector is not part of any current CSS specification. Therefore :checkbox cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method.

The same results can be achieved with valid CSS using $('[type=checkbox]'), without the hit to performance.

If this selector is not preceded by another selector, the universal selector ("*") is implied and so the whole DOM will be searched. Use another selector as in the example below to narrow the search and improve performance.


Signature Description
jQuery(':checkbox')Form checkbox pseudo-class match





:checkbox Example Selectors  <<  Top

Selects all elements of type checkbox.

In the example below we apply a red border to 'checkbox' elements within the form.

  $('.ourform').submit(function () { return false; }); // disable submit 
  $('#btn2').on('click', function() {
    $('form input:checkbox').wrap('<span></span>')
                            .parent().css('border', '1px solid red');

Pie Survey     




Which pie do you prefer?:

Select a pie shape: 


Press the button below to action the above code:

Related Tutorials

jQuery Basic Tutorials - Lesson 4 - jQuery Selectors