2012-02-15 84 views
2

我正在使用jQuery自動完成搜索字段。當自動完成源返回0結果的響應時,自動完成感覺會中斷。我如何總是在自動完成的底部添加幫助消息。如何追加幫手消息到jQuery結束自動完成

我希望幫手信息出現在焦點上,並且隨時有0個或更多結果。以下是我迄今爲止:

 var me = this, 
      cache = {}, // Autocomplete Caching (not built into jQuery UI by default) 
      lastXhr, 
      ac_div = $("#header-search-q"); 

     ac_div.autocomplete({ 
      appendTo: "#header-search", 
      source: function(request, response) { 
       var term = request.term.toLowerCase(); 
       if (term in cache) { 
        response(cache[ term ]); 
        return; 
       } 
       lastXhr = $.getJSON("https://stackoverflow.com/users/search", _(request).extend({'q_type':'all'}), function(data, status, xhr) { 
        cache[ term ] = data.users; 
        if (xhr === lastXhr) { 
         response(data.users); 
        } 
       }); 
      } 
     }) 
     .data("autocomplete")._renderItem = function(ul, item) {   
      return $('<li></li>') 
      .data("item.autocomplete", item) 
      .append("<a>" + item.label + "</a>") 
      .appendTo(ul); 
     }; 
    } 

我怎樣才能始終有一個LI這樣在自動完成:

<li class="helper">Can't find them?</a> 

感謝

回答

1

source你或許可以做一個小的黑客功能,像這樣:

source: function(request, response) { 
       var term = request.term.toLowerCase(); 
       if (term in cache) { 
        response(cache[ term ]); 
        return; 
       } 
       lastXhr = $.getJSON("https://stackoverflow.com/users/search", _(request).extend({'q_type':'all'}), function(data, status, xhr) { 
        cache[ term ] = data.users; 
        if (xhr === lastXhr) { 
         /* Hack follows: */ 
         if(!data.users.length) data.users.push("Can't find them?"); 
         response(data.users); 
        } 
       }); 
      } 

我最近擺弄自動完成源代碼,我發現它很容易定製和改變它的行爲,所以這是另一種選擇。