Handling multiple click event in jQuery where order is important

Question

I am working on a php that application that uses ajax. On all the links where i want to get the link hijacked by jQuery I add the class ajaxlink directly into the link

<a class="someclass ajaxlink" href="somelocation1">goto1</a>
<a class="someclass ajaxlink" href="somelocation2">goto2</a>
<a class="someclass ajaxlink" href="somelocation3">goto1</a>

The javascript looks something like this

$('.ajax-link').click(function(){get link with ajax});

If the user has JavaScript enabled he will get the page trough ajax. One particular i have one multiple pages, so i have the same function to generate the same link for all the pages.

Now my problem is in just one of the links in one page i want to do something different. It has to fire another function when the ajax page return succesfull. Now I have a code like this.

<div class"specialclass">
    <a class="someclass ajaxlink" href="somelocation1">goto1</a>
    <a class="someclass ajaxlink" href="somelocation2">goto2</a>
    <a class="someclass ajaxlink" href="somelocation3">goto1</a>

    <a class="someclass ajaxlink special-1" href="somelocation">goto</a>
    <a class="someclass ajaxlink special-2" href="somelocation">goto</a>
    <a class="someclass ajaxlink special-3" href="somelocation">goto</a>
</div>

$('.ajax-link').click(function(){get link with ajax});
$('.specialclass .special-1,
   .specialclass .special-2,
   .specialclass .special-3').click(function(){get link with ajax});

This setup because i want the normal link that are in the same container to be executed as normal. Only one the special links i want to add another click event. I think i cant add this event to the normal click event, because it only has to fire in one specific page of the application. On all other pages it will be unnecessary code.

This setup however produced errors, because the specialclass click gets fired first, and after that the ajaxlink class. This has to be switched, it only has to fire if the ajaxlink returned a success.

Any one have any ideas on this.

Answer 1

Have you tried using the Complete callback on the ajax request? Jquery Docs for ajaxComplete

Answer 2

You could refactor your normal click function out of the entire process and do this:

var normalClick=function(){/*get link with ajax*/};

$('.ajax-link').click(normalClick);
$('.specialClass').click(
  function(){
    normalClick();
    /* special click code */
  }
);