StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I would start <strong>getting rid of the inline 'onclick'</strong> code and binding the event later:</p> <pre><code> <a href="http://google.com" rel="outbound" >Click</a> $("a[rel=outbound]").click(function(){ var url = this.href; $.ajax({ async: false, type: "POST", url: "Logger.ff", //dynamic url to logging action data: { sid: 'abc123' //random data clicked: url }, contentType: "application/x-www-form-urlencoded; charset=UTF-8", cache: false }); return true; }); </code></pre> <p><strong>Also, you might have a "Race Condition" occurring</strong>. In my example I have <strong>set async to false</strong>. </p> <p>This will stop the function returning and following the link before the request has been performed. </p> <h3>About Async</h3> <p>The reason I use <code>async: false</code> here is because with the default, aync is true, which means the AJAX request may only be partially transmitted by the time the browser sees <code>return: true</code>, and navigates away from the page.</p> <p>This is that "race condition" I was mentioning. Here, its a cheap trick that avoids it by making the browser essentially come to a halt until the request is complete, and then allowing the browser to click the link.</p> <p>A more sophisticated answer would be having it return "false", ( which will kill the browsers native "follow link" behaviour ), and then having the <em>real</em> redirection performed in the <code>complete</code> function.</p> <p>This is not without its own issues mind, and could result in slow browsing behaviour while requests complete, allowing users time to click other links, which appear to do nothing, and then eventually one request gets through at a random time, and a seemingly random redirection occurs.</p> <p>Hence, advanced solutions include blocking the rest of the page and giving some sort of progress indication while the request completes.</p> <p>( And hence, the complexity of this solution is an order of magnitude harder to pull off in a simple example than <code>async: false</code> )</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload