Как я могу улучшить/сократить эти два похожих запроса ajax?

Question

Мой вопрос прост. Это мой код, и я обнаружил, что они похожи на два, как я могу улучшить/сделать этот код короче?

Я считаю, что они похожи во многих местах, поэтому я прошу здесь.

Вот мой код и любая помощь приветствуются.

$(".follow-link").click(function(event) { 
    event.preventDefault(); 
    var therel = $(this).attr('rel'); 
    var followID = $(this).attr('rel').replace(/[^0-9]/g, ''); 
    var thisfollow = $(this); 
    $.ajax({ 
     url: '/ajax/follow.php', 
     type: 'POST', 
     data: {followwho : followID}, 
     dataType: 'json', 
     success: function(data){ 
      if (data.status) { 
       $('a[rel="' + therel + '"]').hide(); 
       $('a[rel="' + therel + '"]').parent().children('.unfollow-link').fadeIn(); 
      } 
     } 
    }); 
}); 

$(".unfollow-link").click(function(event) { 
    event.preventDefault(); 
    var therel = $(this).attr('rel'); 
    var followID = $(this).attr('rel').replace(/[^0-9]/g, ''); 
    var thisfollow = $(this); 
    $.ajax({ 
     url: '/ajax/unfollow.php', 
     type: 'POST', 
     data: {followwho : followID}, 
     dataType: 'json', 
     success: function(data){ 
      if (data.status) { 
       $('a[rel="' + therel + '"]').hide(); 
       $('a[rel="' + therel + '"]').parent().children('.follow-link').fadeIn(); 
      } 
     } 
    }); 
}); 

Answer 1

сделать одну общую функцию и сделать некоторые упрощения очистки работу в этой функции:

function followAjax(event, sel, phpurl) { 
    event.preventDefault(); 
    var thisfollow = $(this); 
    var therel = thisfollow.attr('rel'); 
    var followID = therel.replace(/[^0-9]/g, ''); 
    $.ajax({ 
     url: phpurl, 
     type: 'POST', 
     data: {followwho : followID}, 
     dataType: 'json', 
     success: function(data){ 
      if (data.status) { 
       $('a[rel="' + therel + '"]').hide().parent().children(sel).fadeIn(); 
      } 
     } 
    }); 
} 

$(".unfollow-link").click(function(event) { 
    followAjax.call(this, event, ".follow-link", '/ajax/unfollow.php') 
}); 
$(".follow-link").click(function(event) { 
    followAjax.call(this, event, ".unfollow-link", '/ajax/follow.php') 
}); 

Answer 2

Вы можете использовать ту же функцию в обоих обработчиков, глядя вверх this.className (или с JQuery: $(this).hasClass) и делать тогда соответствующее действие. Или вы используете две функции, производя их в закрытии:

$(".follow-link").click(makeHandler("follow")); 
$(".unfollow-link").click(makeHandler("unfollow")); 

function makeHandler(action) { 
    return function(event) { 
     event.preventDefault(); 
     var therel = $(this).attr('rel'); 
     var followID = $(this).attr('rel').replace(/[^0-9]/g, ''); 
     var thisfollow = $(this); 
     $.ajax({ 
      url: '/ajax/'+action+'.php', 
      type: 'POST', 
      data: {followwho : followID}, 
      dataType: 'json', 
      success: function(data){ 
       // no need to ask for data.status 
       $('a[rel="' + therel + '"]').hide(); 
       $('a[rel="' + therel + '"]').parent().children(action=="follow" 
        ? '.unfollow-link' 
        : '.follow-link' 
       ).fadeIn(); 
      } 
     }); 
    }; 
}