Question

Given the following code:

$(".force-selection").blur(function() {
        var value = $('matched-item').val();
        //check if the input's value matches the selected item
        if(value != $('#matched-item').data('selected-item')) {
            //they don't, the user must have typed something else
            $('#matched-item')
                .val('') //clear the input's text
                .data('selected-item', ''); //clear the selected item
        }
});

How do I refer to the element that was matched by the $(“.force-selection”) jQuery selector? I am not very clear on anonymous JS functions, and I’m confused as to how people know to sometimes declare them like this:

function()

and sometimes like this:

function(event)

and sometimes like this:

function(element, update, options)

and all the other ways.

Answer 1

You can use .currentTarget passed with the jQuery event object as first argument:

$(".force-selection").blur(function(e) { //<-- define e as parameter for this function. it's short for "event"
        e.currentTarget; //The element a blur was triggered on
        var value = $('#matched-item').val(); //<-- add "#"



        //check if the input's value matches the selected item
        if(value != $('#matched-item').data('selected-item')) {
            //they don't, the user must have typed something else
            $('#matched-item')
                .val('') //clear the input's text
                .data('selected-item', ''); //clear the selected item
        }
});