Jquery trigger with data passed not working with on and blur

Question

I dont know why the blur method is not receiving the passed data when using on and a selector.

Here is the code, just foucs any input, and press tab, and you will see that the isTab parameter is not being setted. Why?

Fiddle: http://jsfiddle.net/fz5yA/9/

Html:

<div id="Container">
</div>

JavaScript:

var Container = $("#Container");
Container.on({
    keydown : function(e){
        var Item = $(this);

        console.log(e.keyCode);
        if(e.keyCode == 9) {
            Item.trigger("blur",[true]);
            return false;
        }
    },
    blur : function(e, isTab)
    {
        console.log("IsTab:" + isTab);
    }},".Item");

for(var i = 0 ; i < 10 ; i++)
{
    Container.append("<input class='Item'/>");
    Container.append("<br/>");
}

Answer 1

The system generated blur event just has one argument, not two. There is no isTab argument passed to that event handler in the normal way that the system creates that event. You can see that in the jQuery doc.

If you change the event name of your manually triggered event to something that isn't the normal blur event and you fix the way you are passing the argument in .trigger(), then the extra argument will work. Change to this and you will see the extra argument:

Container.on({
    keydown : function(e){
        var Item = $(this);

        console.log(e.keyCode);
        if(e.keyCode == 9) {
            console.log("aaa");
            Item.trigger("myEvent", true);   // Changed event name and fixed the syntax in this line
            return false;
        }
    },
    myEvent : function(e, isTab)             // Changed event name here
    {
        console.log("IsTab:" + isTab);
    }},".Item");

Demo here: http://jsfiddle.net/jfriend00/fz5yA/17/