Clever Geek Handbook

How do I pass data to a function when adding an event listener?

Here is my code:

$(document).ready(function(){
dropbox.addEventListener("dragenter", somethingHappens, false);
});

function somethingHappens(evt) {
    // code here
}

How can I pass data to somethingHappens () function when attaching an event listener? Is it possible? I was looking for something I could do:

function somethingHappens(evt,dataItem1,dataItem2) {
    // code here, I need to use evt here
}

Thanks for the help!

+3


source to share


2 answers


You can do it old school if you don't mind using an anonymous function as a handler:

var data = { foo: 'bar' };

dropbox.addEventListener("dragenter", function(evt) {
    somethingHappens.call(this, evt, data);
}, false);

function somethingHappens(evt, data) {
    console.log(data);
}


But I'm also pretty sure you can use jQuery events for this:

$(dropbox).bind( 'dragenter', { foo: 'bar' }, somethingHappens );

function somethingHappens(evt) {
    console.log(evt.data);
}
+4


source


You can use jQuery bind method : -



$(document).ready(function(){
$('#yourdropboxid').bind("dragenter", { foo: 'bar' }, somethingHappens);
});

function somethingHappens(event) {
   alert(event.data.foo); // alerts 'bar'
}
+1


source






More articles:


All Articles