Hooking javascript function before navigating to a link

Links are very common navigation elements in a HTML page. As most of us know a link looks like

<a href="http://lalitbhatt.net/logout">Logout</a>

This will give us a link as follows and clicking on that will navigate to a new page.

Logout



Sometimes we want to do something more on the page before navigating away. An example is that when a logout is done we might want to clean up the localStorage. In that case we would like to call a javascript function before navigation happens.

To achieve that, hook a javascript function on the link

<a onclick="cleanupBeforeLogut()">Log out</a>

The javascript function is as follows

function cleanupBeforeLogut(){
   if(typeof(Storage) !== "undefined") {
     localStorage.clear();
   }
   location.href = "http://lalitbhatt.net/logout" ;
}