.map() JQ Home  <<  Filtering  <<  .map()

Filter elements.

Description

The .map() method is used to pass each element within the current matched set through a function, producing a new jQuery object containing returned values.

Syntax

Signature Description
.map( callback(index, domElement) )Pass each element within the current matched set through a function, producing a new jQuery object containing returned values.

Parameters

Parameter Description Type
callback(index, domElement)A function.
  • Each time the callback runs, it is passed the current index position of the element in the set.
  • The current element is also passed.
  • The callback is fired in the context of the current element in the set, so the keyword this refers to that element.
  • The function can return an individual data item or an array of data items to be inserted into the new jQuery object.
    • If an array is returned, the elements inside the array are inserted into the set.
    • If the function returns null or undefined, no element will be inserted.
Function

Return

A jQuery object containing the filtered elements.

.map( callback(index, domElement) ) Example Filtering  <<  Top

Pass each element within the current matched set through a function, producing a new jQuery object containing returned values.

In the example we add to the paragraph below each checkbox value that is checked.

Pie Survey

Which pies do you like?:



$(function(){
  $('#btn5').on('click', function() {
    $("#yourpies").append( $("#form1 input[type='checkbox']").map(function(){
      
      if ($(this).is(":checked")) {
          return $(this).val();
      }
    }).get()
      .join(", ") );
  });
});

You like:

Press the button below to action the above code:

Related Tutorials

jQuery Intermediate Tutorials - Lesson 1 - Filtering Elements