Click behaviour - Difference in IE and FF ?!

Question

Hey folks,

i just came to the conclusion that a project i am currently working on might have a "logical" error in functionality.

Currently I'am using server technology with PHP/MySQL and JQuery. Within the page there's a normal link reference with tag

<a href="contentpage?page=xxx">next step</a>

The pain point now seems to be the given jquery click event on the same element. The intension was to save the (current) content of the page (-> form elements) via another php script using the php session command. For any reason, IE can handle the click event of Jquery right before executing the standard html command, that reloads the current page again with the new page parameter. By using FF the behaviour is different. I assume, that FF first execute the html command and afterwards execute the javascript code which handles the click event. Therefore the resultset here is wrong respectivly empty.

My question now is whether you made the same experience and how you handled / wordarrounded this problem.

I'd be thankful fur any of your tips or further feedback. Maybe you also have a solution on how to rethink about the current architecture.

Regards, Oliver

Answer 1

If I understand you correctly, you are assigning a click event to the link, leaving the href in place and ready to fire. That is very unwise, as the time left for any javascript in the click event to execute when the user clicks the link is limited, and arbitrary. It can well be that different browsers handle this differently - anyway, it's the wrong approach. You can never be sure your actions get executed in full.

The usual approach would be to have the click event return false, preventing the default action of the link to fire, and do a relaxed location.href = this.href when everything is done.

If you are using Ajax to send away some data, then put the location.href part into the success callback of your Ajax call. That way, you can be 100% sure the data gets sent.

Answer 2

actually firefox do raise the event and execute the command that is attached to it before the hyperlink takes the redirecting action, maybe an error happened while executing the command and IE allowed it to complete its action while firefox throw an error and jQuery function block handled it which you will not notice an exception was thrown. make a test button with classical onclick event and test your function and see if it is working probably in firefox