7.jQuery UIメールボックス自動補完

ソース属性のfunctionコールバック関数を自動的に補完することで、データソースを動的に設定し、
メールボックス補完機能を実現します.
一.データソースfunction
自動補完UIのsourceは配列だけでなくfunctionコールバック関数であってもよい.持参した
2つのパラメータは、動的なデータソースを設定します.

$('#email').autocomplete({

   source : function (request, response) {

      alert(request.term);        //         

      response(['aa', 'aaaa', 'aaaaaa', 'bb']);        //      

   },

});

注意:ここのresponseは、キーワードを検索することによって、関係のない結果をフィルタリングするのではなく、結果全体を表示します.
さあ.ソースデータソース自体が動的に変更されるため、カスタマイズによってシステムに組み込まれた検索能力が放棄されます.
二.メールボックスの自動補完

$('#email').autocomplete({

   autoFocus : true,

   delay : 0,

   source : function (request, response) {

      var hosts = ['qq.com','163.com', '263.com', 'gmail.com', 'hotmail.com'],       //  

         term = request.term,       //     

         ix = term.indexOf('@'),       //@

         name = term,       //   

         host = '',       //    

         result = [];       //  

      //          
      result.push(term);

      if (ix > -1) {        //   @   

         name = term.slice(0, ix);       //     

         host = term.slice(ix + 1);       //    

      }

      if (name) {

         //       
         var findedHosts = (host ? $.grep(hosts, function (value, index) {

                                 return value.indexOf(host) > -1;

                             }) : hosts),

         //       
         findedResults = $.map(findedHosts, function (value, index) {

                           return name + '@' + value;

                         });

          //        
         result = result.concat(findedResults);

      }

      response(result);

   },

});