Повторного использования функции AJAX несколько раз

Question

В настоящее время моего вызов AJAX настроен как таковые, так что, когда запятая KeyUp обнаружен, вызов пожары AJAX:

$("#selector").on("keyup", function(e) { 
    if (e.which === 188) { 

     var search = $(this).val(); 

     function searchTag() { 
      return $.ajax({ 
       cache:  false, 
       url:  url, 
       dataType: "json", 
       type:  "post", 
       data:  {search: search} 
      });    
     } 

     searchTag().done(function(data) { 
      //Success 
     }); 
    } 
}); 

Я хочу, чтобы повторно использовать вызов AJAX как часть другого события слушатель позже в моем коде:

$("body").on("click", ".tag", function() { 
    searchTag(); 
}); 

без перезаписи весь вызов, как сделать функцию независимой, так что он может быть использован в обоих сценариях?

Answer 1

Переместить функцию вне:

function searchTag(data) { 
    var url = "yoururl"; 
    return $.ajax({ 
     cache:  false, 
     url:  url, 
     dataType: "json", 
     type:  "post", 
     data:  data 
    });    
} 

$("#selector").on("keyup", function(e) { 
    if (e.which === 188) { 

     var search = {search: $(this).val()}; 


     searchTag(search).done(function(data) { 
      //Success 
     }); 
    } 
}); 

$("body").on("click", ".tag", function() { 
    searchTag({}); 
}); 

Answer 2

удалить функцию от события, а также добавить в качестве входных данных значение поиска и URL в качестве входных данных:

function searchTag(searchVal, url) { 
      return $.ajax({ 
       cache:  false, 
       url:  url, 
       dataType: "json", 
       type:  "post", 
       data:  {search: searchVal} 
      });    
     } 

$("body").on("click", ".tag", function() { 
    var searchVal = $(this).val(); 
    var url = document.URL; //use any url here 
    searchTag(searchVal, url); 
}); 

вы можете даже использовать функцию обратного вызова:

function searchTag(searchVal, url, callbck) { 
      return $.ajax({ 
       cache:  false, 
       url:  url, 
       dataType: "json", 
       type:  "post", 
       data:  {search: searchVal} 
      }).done(function(){ 
       callbck(); 
      });    
     } 

$("body").on("click", ".tag", function() { 
    var searchVal = $(this).val(); 
    var url = document.URL; //use any url here 
    searchTag(searchVal, url, function(){ 
     //do something here.. 
    }); 
}); 

Answer 3

Об этом:

///tag -> tag to search 
///cb -> callback to executed on success 
var searchTag = function(tag, cb) { 
    var url = "http://example.com"; 
    var request = $.ajax({ 
     cache:  false, 
     url:  url, 
     dataType: "json", 
     type:  "post", 
     data:  {search: tag} 
    });   
    request.done(cb); 
} 

$("#selector").on("keyup", function(e) { 
    if (e.which === 188) { 
     var search = $(this).val(); 
     searchTag(search, function(data) { 
      //Success 
     }); 
    } 
}); 

$("body").on("click", ".tag", function() { 
    //I don't actually know where the tag to search is stored 
    var search = $(this).html(); 
    searchTag(search); 
});