如何结合两个jQuery函数的代码来减少执行时间?


How can I combine code of the two jQuery functions to reduce execution time?

我有以下两个函数。第一个是为自动完成功能编写的,第二个是用于检查用户是否从自动填充列表中选择了值。但是,由于我在这两个函数中使用了相同的AJAX功能,因此完成执行需要花费太多时间。有人可以帮助我优化我写的代码,使一个单一的功能?

我的代码如下:
$('.dynamic_cat').keyup(function() {
  $(".dynamic_cat").typeahead({
    source: function(query, process) {
      var textVal   = $(".dynamic_cat").val();
      var admin_url = $("#admin_url").val();
      $.ajax({
        url: admin_url+'modules/product_types/product_types.php',
        type: 'POST',
        data: 'op=get_all_categories',
        dataType: 'JSON',
        async: true,
        success: function(data) {
          process(data);        
        }
      });
    }
  });
});

$(document).ready(function() {
  $('.dynamic_cat').blur(function() {
    if( $('.dynamic_cat').val() ) {  
      var textVal   = $(".dynamic_cat").val();
      var admin_url = $("#admin_url").val();
      $.ajax({
        url: admin_url+'modules/product_types/product_types.php',
        type: 'POST',
        data: 'op=get_all_categories',
        dataType: 'JSON',
        async: true,
        success: function(data) {
          if($.inArray(textVal, data) == -1) {
            alert("Please select the value from list only!!!");
            $('.dynamic_cat').val("");
          }      
        }
      });
    } 
  });  
});

你可以使用typeahead:selected event,来设置一个变量,如果value是从列表中选择的,在文本框的keyup上重置变量,然后在blur上,检查变量是否被设置为true,否则会提醒用户

提前输入自定义事件

演示链接完整示例

类似:

var isItemSelectedFromTypeAhead = false;
$('.dynamic_cat').keyup(function() {
//On keyup reset it
  isItemSelectedFromTypeAhead = false;
  $(".dynamic_cat").typeahead({
   source: function(query, process) {
   var textVal   = $(".dynamic_cat").val();
   var admin_url = $("#admin_url").val();
  $.ajax({
    url: admin_url+'modules/product_types/product_types.php',
    type: 'POST',
    data: 'op=get_all_categories',
    dataType: 'JSON',
    async: true,
    success: function(data) {
      process(data);        
    }
  });
}
  }).on('typeahead:selected', function(obj, selected, name) {
  //Something is selected from typeahead
  isItemSelectedFromTypeAhead = true;
  });
$('.dynamic_cat').blur(function() {
  var curValue = $(this).val();
  if(curValue !== "" && !isItemSelectedFromTypeAhead)
  {
    alert("Please select the value from list only!!!");
    $('.dynamic_cat').val("");
  }
});