jquery ui自動完成多個「響應」方法

Question

讓我們看看我能否解釋得很好......我有一個函數爲我的autocompletes（minLength，delay，close，response ...）設置常用選項。 但是我的一個autocompletes需要在響應方法上做一些額外的工作。我怎樣才能執行「原始共同響應功能」和額外的工作？ 有沒有可能擴展小部件？

function attachAutocomplete_Common(arControlIds) { 
    $.each(arControlIds, function (i, control) { 
     $("#" + control).autocomplete({ 
      minLength: 3, 
      delay: 800, 
      autoFocus: true, 
      focus: function (event, ui) { 
       $(this).val(ui.item.label); 
       return false; 
      }, 
      response: function (event, ui) { 
       if (ui.content != null && ui.content.length === 1) { 
        $(this).data("ui-autocomplete").term = null; 
        $(this).data("ui-autocomplete")._trigger("select", "autocompleteselect", { item: ui.content[0] }); 
        $(this).autocomplete("close"); 
       } 
      } 
     }); 
    }); 
} 

$(document).ready(function() { 
    attachAutocomplete_Common(["cmbCountry", "cmbCity", "cmZipCode"]); 

    $("#cmZipCode").autocomplete({ 
     response: function (event, ui) { 
      [execute common response function]; 
      doSomeExtraWork(); 
     } 
    }); 
}); 

Answer 1

基於Risadinha的答案我做到了。嘗試訪問「commonResponse」功能中的「this」時發生錯誤。這是工作代碼。

var commonResponse = function (event, ui, $ctl) { 
    if (ui.content != null && ui.content.length === 1) { 
     var $self = $ctl || $(this); 

     $self.data("ui-autocomplete").term = null; 
     $self.data("ui-autocomplete")._trigger("select", "autocompleteselect", { item: ui.content[0] }); 
     $self.autocomplete("close"); 
    } 
}; 

function attachAutocomplete_Common(arControlIds) { 
    $.each(arControlIds, function (i, control) { 
     $("#" + control).autocomplete({ 
       // ommitted, see above 
      }, 
      response: commonResponse 
     }); 
    }); 
} 

$(document).ready(function() { 
    attachAutocomplete_Common(["cmbCountry", "cmbCity", "cmbZipCode"]); 

    $("#cmbZipCode").autocomplete({ 
     response: function (event, ui) { 
      commonResponse(event, ui, $(this)); 
      doSomeExtraWork(); 
     } 
    }); 
}); 

Answer 2

將通用代碼放到它自己的函數中，在小部件之外。然後從兩個位置稱之爲 - 從response內attachAutocomplete_Common並從#cmZipCode之一：

var commonResponse = function (event, ui) { 
    if (ui.content != null && ui.content.length === 1) { 
     $(this).data("ui-autocomplete").term = null; 
     $(this).data("ui-autocomplete")._trigger("select", "autocompleteselect", { item: ui.content[0] }); 
     $(this).autocomplete("close"); 
    } 
}; 

function attachAutocomplete_Common(arControlIds) { 
    $.each(arControlIds, function (i, control) { 
     $("#" + control).autocomplete({ 
       // ommitted, see above 
      }, 
      response: commonResponse.bind(this) 
     }); 
    }); 
} 

$(document).ready(function() { 
    attachAutocomplete_Common(["cmbCountry", "cmbCity", "cmZipCode"]); 

    $("#cmZipCode").autocomplete({ 
     response: function (event, ui) { 
      commonResponse.bind(this)(event, ui); 
      doSomeExtraWork(); 
     } 
    }); 
}); 

編輯：作用域問題：要麼就像對方的回答，或通過結合。我更新了代碼。我沒有試過是否在如圖所示的each循環中綁定函數就足夠了。