Attaching Events to an Empty Array with jQuery.on()

Question

Another question where I get to murder barry.

Can you attach events to an empty array using jQuery's .on() ?

var barry = new Person();
var steve = new Person();
var paul = new Person();

var people = [];


function Person() {

}

Person.prototype.murder = function() {
    $(this).triggerHandler("murder");
}


/*
    If I apply .on to an empty array the event is never triggered why?
            $(people).on("murder", function(){
       console.log("call the police");
    })

 */

people.push(barry)
people.push(steve)
people.push(paul)

$(people).on("murder", function() {
    console.log("call the police");
})

barry.murder();

Here's a fiddle suggesting you can't; but why not? I would of assumed that the array is the delegate object?

The object is not even aware that it is in an array

Esailija
– Esailija

2012-10-25 15:35:59 +00:00
Commented Oct 25, 2012 at 15:35 — Esailija
– Esailija, Commented Oct 25, 2012 at 15:35

thorn0 · Accepted Answer · 2012-10-25 15:41:07Z

3

You're not binding events to an array. Calling the $ function on an array [a,b,c] is the same as $(a).add(b).add(c). And $([]) is the same as just $() (an empty jQuery object).

answered Oct 25, 2012 at 15:41

thorn0

10.6k6 gold badges71 silver badges101 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Pointy · Accepted Answer · 2012-10-25 15:45:56Z

2

You can, but jQuery doesn't magically synthesize triggering methods for you.

people.trigger("murder");

It's also not going to work to trigger events on values that happen to be in the array; there's no event bubbling from array element to the containing array. Event bubbling works in the DOM, not on JavaScript data structures.

edit — oh sorry I see now that you've created your own .murder() API. Fine then, but you've still got the issue with event bubbling.

There's no firm relationship between an object and any array that happens to contain a reference to it. You could extend your API so that your "Person" objects could know where to send the events.

edit again — oh well I feel dumb now - this really doesn't have anything to do with an array as an object. When you wrap a jQuery object around an array instance, that's interpreted by the library as a request to treat the elements of the array as the members of the jQuery object. Thus, when you add the event handler, the array doesn't really have anything to do with it: you're adding the handler to the individual elements.

edited Oct 25, 2012 at 15:45

answered Oct 25, 2012 at 15:34

Pointy

415k62 gold badges600 silver badges632 bronze badges

5 Comments

Jon Wells Over a year ago

@Pointy sorry, I've just updated the fiddle I forgot to include jQuery. It does work for me (in chrome)

Pointy Over a year ago

@CrimsonChin in Firefox even with jQuery imported, there's nothing logged on the console.

Esailija Over a year ago

It should work considering jQuery converts the array to a jQuery object of 3 elements, and calling .on on the jQuery object will attach a handler to each element separately.

Jon Wells Over a year ago

Hi Pointy, you're right it doesnt ouput to console in firefox but if you change it to an alert it does seem to work

Pointy Over a year ago

@CrimsonChin ah I see what's going on; sorry everybody :-)

Collectives™ on Stack Overflow

Attaching Events to an Empty Array with jQuery.on()

2 Answers 2

Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related