CODEWITHSUNDEEP
javascriptjqueryfunction
Martind
Martind

Reputation: 191

jQuery function in .click() etc

So normally, I do it like this:

$('#selectRoom a').click( function(e) { 
e.preventDefault(); // To prevent the default behavior (following the link or adding # to URL)
// Do some function specific logic here
});

However, I would like to do it like this, to clean things up (and be able to reuse):

$('#selectRoom a').click( selectRoom );

function selectRoom () {
    e.preventDefault(); // To prevent the default behavior (following the link or adding # to URL)
    // Do some function specific logic here
}

The problem is, i cant pass the "e" event-handler to the function, then the selectRoom() function is called on load. i.e:

$('#selectRoom a').click( selectRoom(e) );

Can I fix this somehow?

Upvotes: 1

Views: 118

Answers (3)

James Westgate
James Westgate

Reputation: 11444

You can also return false from the function to prevent the event from continue to bubble.

Upvotes: 0

Pointy
Pointy

Reputation: 413757

Declare it like this:

function selectRoom(e) {
  // now e will work
}

Do not do this:

$('#selectRoom a').click(selectRoom(e)); // WRONG DO NOT DO THIS

because that means, "Call the function selectRoom and then pass its return value to the "click" function in jQuery." You want to pass jQuery the name of the funcion, not the result of executing the function. Thus:

$('#selectRoom a').click(selectRoom);

Upvotes: 2

Amy B
Amy B

Reputation: 17977

selectRoom() will be given the event:

function selectRoom(e)

That should work.

Upvotes: 6

Related Questions