jQuery - passing id element to a non-anonymous callback function without using an anonymous function

Question

I'm trying to pass an element's id to storePair

$("#someid").click(storePair($(this).val(),$(this).attr("id"));

using $(this) doesn't work. no value.

Another stackoverflow post suggests that I use an anonymous function as a wrapper for StorePair(val,id), i.e.,

$("#someid").click(function(){storePair($(this).val(),$(this).attr("id")});

That seems kind of roundabout... Is there a way to call StorePair and pass the value and id without using the anon function?

Answer 1

use the event data?

var someId = $("#someid");

someId.bind("click", 
                  { value : someId.val(), id: someId.attr("id") }, 
                  storePair);

but you have access to the element that raised the event inside of storePair through event.target, so you can wrap this in $() and get values inside the function

Answer 2

You can use this inside the storePair function to get what you're after, like this:

function storePair() {
  var val = $(this).val();
  var id = this.id;
  //do stuff
}

Then bind it like this:

$("#someid").click(storePair);

Or, use an anonymous function like you already have, round-about or not, it's the way it works :)

Answer 3

It's not a roundabout, it's supposed to work that way. The click function (and any of the binding function cousins) accept a function object to be evaluated when the event triggers.

You are evaluating the function storePair when defining the callback, so it won't work.