Is there any way to prevent default event and then fire it again with jQuery?

Question

Basically I have an anchor element, <a href='bla..'>link</a>

On click, I first want to do something and only once it's done I want to take the user to the page that it links to. Something like:

$('a').click(function(ev){
   ev.preventDefault();

   //do something here

   ev.refireDefault();
});

Any suggestions?

Update

My apologies! My FireFox decided to cache the previous version of JS, so nothing that I tried worked until a simple CTRL+F5 solved the issue.

@Ron and others who come here because of the title, is something like [this](http://stackoverflow.com/questions/18050538/invoke-the-default-action-of-a-specific-event-on-an-object) what you are looking for? Hopefully an answer will come — Hashbrown, Aug 05 '13 at 04:24

Code Maverick · Accepted Answer · 2014-03-14T15:46:20.357

21

Javascript is not multi-threaded. It is event driven and events fire in the order in which you load them. Therefore, if you simply leave out the ev.preventDefault() in your click event altogether, it won't fire the default action until the function exits.

See jsFiddle here

EDIT per @Greg's comment:

The only scenario in which the above is not true is with asynchronous functions. In that scenario you would want to prevent the default action first and then in the asynchronous callback function, re-fire the default action.

edited Mar 14 '14 at 15:46

answered May 19 '11 at 15:36

Code Maverick

20,171
12
62
114

2

+1 For you too. No idea why any of us would deserve a downvote, the answer isn't wrong. – Lazarus May 19 '11 at 15:47
OK, didn't mean to accuse, so I apologize. I just don't see how most of these answers are getting downvoted. – Eli May 19 '11 at 15:51
5

This treats the question as an X/Y problem ... but actually there is valid need to prevent an event and then refire it, such as when asynchronous functions occur within the event. – Greg Feb 22 '13 at 11:46
@Greg - You are correct, that would be the only reason where you may choose to prevent the default action and then refire it. However, that's not what the OP stated he was doing, therefore the answer I gave is correct and does not deserve your down vote. I will edit my answer to include your concern though. – Code Maverick Feb 22 '13 at 13:45
1

@RyanSchumacher - Thank you, I renamed my jsFiddle account and thus, all links were broken. I've updated it. – Code Maverick Mar 14 '14 at 15:47
+1 for the asynchronous callback function part, it was exactly what I needed. – GChorn Apr 22 '14 at 20:55
The asynchronous callback part tells me something that tbh I already know, but doesn't actually suggest a solution that doesn't involve repeating the same code that was initially running. There should be an `e.triggerDefault()` that can be fired at the end of an asynchronous call, or something similar. Moh well. – Matt Fletcher Nov 25 '15 at 13:29

score 5 · Answer 2 · answered May 19 '11 at 15:34

preventDefault marks the event as handled so that when your click function exits, the default action isn't taken. If you don't call preventDefault then the default click action won't get called until your click function exits. So remove it and it'll work as you are suggesting.

score 5 · Answer 3 · answered May 19 '11 at 15:35

5

The link will not go till after the work is done, so you can do:

$('a').click(function(ev){
   //do something here
});

answered May 19 '11 at 15:35

Dustin Laine

37,935
10
86
125

score 4 · Answer 4 · answered May 19 '11 at 15:38

4

after performing your desired action why don't you just redirect it to the page by adding this line:

window.location = 'welcome.php';

answered May 19 '11 at 15:38

Safran Ali

4,477
9
40
57

score 1 · Answer 5 · answered May 19 '11 at 15:38

1

It can be done like this:

<a onclick="JavaScriptCodeHere; return true;" href='bla..'>link</a>

1) The onclick needs to be before the href.

2) return true; makes sure that user will be taken to the linked page after your JS code executes. If you use return false; - linked itself will not work, it will just fire your JavaScript on click;

answered May 19 '11 at 15:38

Scherbius.com

3,396
4
24
44

2

perhaps people have taken offence at the use of inline attributes for js rather than using unobtrusive event hookups – redsquare May 19 '11 at 15:44

Is there any way to prevent default event and then fire it again with jQuery?

Update

5 Answers5

Linked