2011-01-18 4 views
4

Я уверен, что вы, ребята, видели это отличный плагин:JQuery автозаполнения - нужно инициировать только тогда, когда специальный символ набирается

http://code.drewwilson.com/entry/autosuggest-jquery-plugin

я проверил его и не мог найти вариант, чтобы начать autosuggest plugin только при наведении определенного символа. В этом случае мне нужно, чтобы это было на знаке «@».

Я вижу, что есть возможность устанавливать минимальное количество символов: minChars: номер (1 по умолчанию)

Однако, мне нужно для выпадающего списка, чтобы не показывать, пока знак @ не набирается.

FYI, вот варианты в jquery.autoSuggest.js

 var defaults = { 
     asHtmlID: false, 
     startText: "Enter Name Here", 
     emptyText: "No Results Found", 
     preFill: {}, 
     limitText: "No More Selections Are Allowed", 
     selectedItemProp: "value", //name of object property 
     selectedValuesProp: "value", //name of object property 
     searchObjProps: "value", //comma separated list of object property names 
     queryParam: "q", 
     retrieveLimit: false, //number for 'limit' param on ajax request 
     extraParams: "", 
     matchCase: false, 
     minChars: 1, 
     keyDelay: 400, 
     resultsHighlight: true, 
     neverSubmit: false, 
     selectionLimit: false, 
     showResultList: true, 
     start: function(){}, 
     selectionClick: function(elem){}, 
     selectionAdded: function(elem){}, 
     selectionRemoved: function(elem){ elem.remove(); }, 
     formatList: false, //callback function 
     beforeRetrieve: function(string){ return string; }, 
     retrieveComplete: function(data){ return data; }, 
     resultClick: function(data){}, 
     resultsComplete: function(){} 
    }; 
    var opts = $ 

Спасибо!

ответ

0

Я до сих пор не использовал этот элемент управления, но похоже, что вам захочется заглянуть в файл jquery.autoSuggest.js (без указания размера). Проверьте это дело. Я думаю, вам нужно будет поменять default: на case x:, где x - это код ascii для ключа, который вы хотите использовать для запуска автозаполнения.

   switch(e.keyCode) { 
        case 38: // up 
         e.preventDefault(); 
         moveSelection("up"); 
         break; 
        case 40: // down 
         e.preventDefault(); 
         moveSelection("down"); 
         break; 
        case 8: // delete 
         if(input.val() == ""){       
          var last = values_input.val().split(","); 
          last = last[last.length - 2]; 
          selections_holder.children().not(org_li.prev()).removeClass("selected"); 
          if(org_li.prev().hasClass("selected")){ 
           values_input.val(values_input.val().replace(","+last+",",",")); 
           opts.selectionRemoved.call(this, org_li.prev()); 
          } else { 
           opts.selectionClick.call(this, org_li.prev()); 
           org_li.prev().addClass("selected");  
          } 
         } 
         if(input.val().length == 1){ 
          results_holder.hide(); 
          prev = ""; 
         } 
         if($(":visible",results_holder).length > 0){ 
          if (timeout){ clearTimeout(timeout); } 
          timeout = setTimeout(function(){ keyChange(); }, opts.keyDelay); 
         } 
         break; 
        case 9: case 188: // tab or comma 
         tab_press = true; 
         var i_input = input.val().replace(/(,)/g, ""); 
         if(i_input != "" && values_input.val().search(","+i_input+",") < 0 && i_input.length >= opts.minChars){ 
          e.preventDefault(); 
          var n_data = {}; 
          n_data[opts.selectedItemProp] = i_input; 
          n_data[opts.selectedValuesProp] = i_input;                    
          var lis = $("li", selections_holder).length; 
          add_selected_item(n_data, "00"+(lis+1)); 
          input.val(""); 
         } 
        case 13: // return 
         tab_press = false; 
         var active = $("li.active:first", results_holder); 
         if(active.length > 0){ 
          active.click(); 
          results_holder.hide(); 
         } 
         if(opts.neverSubmit || active.length > 0){ 
          e.preventDefault(); 
         } 
         break; 
        default: 
         if(opts.showResultList){ 
          if(opts.selectionLimit && $("li.as-selection-item", selections_holder).length >= opts.selectionLimit){ 
           results_ul.html('<li class="as-message">'+opts.limitText+'</li>'); 
           results_holder.show(); 
          } else { 
           if (timeout){ clearTimeout(timeout); } 
           timeout = setTimeout(function(){ keyChange(); }, opts.keyDelay); 
          } 
         } 
         break; 
       } 

Может быть больше, как этот

   switch(e.keyCode) { 
        case 38: // up 
         e.preventDefault(); 
         moveSelection("up"); 
         break; 
        case 40: // down 
         e.preventDefault(); 
         moveSelection("down"); 
         break; 
        case 8: // delete 
         if(input.val() == ""){       
          var last = values_input.val().split(","); 
          last = last[last.length - 2]; 
          selections_holder.children().not(org_li.prev()).removeClass("selected"); 
          if(org_li.prev().hasClass("selected")){ 
           values_input.val(values_input.val().replace(","+last+",",",")); 
           opts.selectionRemoved.call(this, org_li.prev()); 
          } else { 
           opts.selectionClick.call(this, org_li.prev()); 
           org_li.prev().addClass("selected");  
          } 
         } 
         if(input.val().length == 1){ 
          results_holder.hide(); 
          prev = ""; 
         } 
         if($(":visible",results_holder).length > 0){ 
          if (timeout){ clearTimeout(timeout); } 
          timeout = setTimeout(function(){ keyChange(); }, opts.keyDelay); 
         } 
         break; 
        case 9: case 188: // tab or comma 
         tab_press = true; 
         var i_input = input.val().replace(/(,)/g, ""); 
         if(i_input != "" && values_input.val().search(","+i_input+",") < 0 && i_input.length >= opts.minChars){ 
          e.preventDefault(); 
          var n_data = {}; 
          n_data[opts.selectedItemProp] = i_input; 
          n_data[opts.selectedValuesProp] = i_input;                    
          var lis = $("li", selections_holder).length; 
          add_selected_item(n_data, "00"+(lis+1)); 
          input.val(""); 
         } 
        case 13: // return 
         tab_press = false; 
         var active = $("li.active:first", results_holder); 
         if(active.length > 0){ 
          active.click(); 
          results_holder.hide(); 
         } 
         if(opts.neverSubmit || active.length > 0){ 
          e.preventDefault(); 
         } 
         break; 
        case x: 
         if(opts.showResultList){ 
          if(opts.selectionLimit && $("li.as-selection-item", selections_holder).length >= opts.selectionLimit){ 
           results_ul.html('<li class="as-message">'+opts.limitText+'</li>'); 
           results_holder.show(); 
          } else { 
           if (timeout){ clearTimeout(timeout); } 
           timeout = setTimeout(function(){ keyChange(); }, opts.keyDelay); 
          } 
         } 
         break; 
        default: 
          //Do Nothing 
       } 
+0

Большое спасибо за ответ .... Этот код, похоже, вообще не запускает выпадающий список. Мне просто нужно его активировать, когда набирается знак at. то есть когда кто-то вводит @, он будет находиться в состоянии «включено» и будет запускать автозагрузку, когда они напечатают больше текста после @. Любые другие идеи? –

+0

Это должен быть случай: 64 Я верю ... Поэтому, когда я добавляю это, он не активируется, потому что он пытается найти, есть ли знак @ в данных, которые он никогда не будет ... Когда я добавьте случай: 32 для пробела, он активируется успешно, потому что он фактически находит пробелы в данных ... Мне просто нужно его «активировать», когда набирается знак @. Спасибо –

+0

На самом деле это случай: 50 ... так что теперь работает ... Проблема в том, что он ищет знак @ в данных ... Мне просто нужно найти строку после знака at. Спасибо за любую дополнительную помощь –

1

Я думаю, что вы можете играть с beforeRetrieve:

beforeRetrieve: function(string){ 
if (string.indexOf('@') == -1) return ""; 
return string; 
} 

Из док:

beforeRetrieve: функция обратного вызова - Пользовательские функции, которые запускается прямо перед запросом AJAX или перед локальным объектом rched. Это используется для изменения строки поиска до ее обработки. Поэтому, если пользователь ввел «jim» в поле AutoSuggest, вы можете вызвать эту функцию, чтобы добавить свой запрос с помощью «guy_». Создание окончательного запроса = "guy_jim". Поисковый запрос передается в эту функцию. Пример: beforeRetrieve: function (string) {return string; }

+0

Спасибо за ответ ... Однако это создало странное поведение, которое выделило все пробелы между символами в раскрывающемся списке. –

Смежные вопросы