jquery - How to wait for ajax call of another element's click event to finish -

this question exact duplicate of:

• check once function complete 2 answers

i'm trying call element's click event inside click event window.location.href = mailto:emailaddress problem other element has ajax call , window.location.href seems cancelling ajax call. there easy way wait ajax call inside click event finish before executing window.location.href in scenario?

here sample of html & javascript:

<a id="email-link" href="mailto:emailaddress@email.com">emailaddress</a>  <div class="right" id="list-items"> <ul>     <li>item 1</li>     <li>item</li> </ul> </div>  <script type="text/javascript">     $('#list-items').live('click', function () {         jquery.ajax({             url: "@url.action("index", "home")",             success: function () {                 console.log('done');             }         });     });      $('#email-link').live('click', function () {         //let's it's first item of li         var liitem = $('#list-items li').first();         var thislink = $(this);          window.location.href = thislink.attr("href");          return false;     }); </script> 

instead of simulating click event, externalize function performs main operation , pass callback function:

function dostuff(obj, fn) {     jquery.ajax({         url: "@url.action("index", "home")",         success: function () {             console.log('done');             fn && fn();         }     }); }  $('#list-items').on('click', function () {     dostuff(this); });  $('#email-link').on('click', function () {     //let's it's first item of li     var liitem = $('#list-items li').get(0),     url = this.href;      dostuff(liitem, function() {         window.location.href = url;     });      return false; });