Question

What happens when I want to refer to “this” in nested statements, which “this” does it use?

Here’s an example to show what i mean by the above:

    $("input").blur(function(){
            var theThis = $(this);
            if(!($(".invalid").length > 0)){
                //if there's no messages already open
                theThis.data("validator").checkValidity();
            }else{
                //add the message to the next to be displayed
                nextToAlert.push(theThis);
                //bind an event to the errored field being changed
                $(".invalid").on("change", function(){
                    var me = $(this);
                    if(!me.hasClass('invalid')){
                        nextToAlert.pop().checkValidity();

                    }
                });
            }
    });

Answer 1

In your code:

• theThis refers to $("input")
• me revers to $(".invalid")

$(this) will always change depending on the current scope.

When you use any sort of action-binding function such as blur, on, bind, live, etc, then $(this) will refer to the current jQuery object that the event is being bound to.