jQuery Autocomplete Плагин, который запускает после токена

Question

Я создаю приложение и хотел бы сделать автозаполнение в текстовом поле, так же, как Twitter/Facebook делает их с помощью @ [name]. Тем не менее, я хотел бы, чтобы он срабатывал при вводе [TID: x], где x - целое число любой длины.

Похоже, что Twitter/Facebook начинают свою автозаполнение после того, как вы нажмете знак @, а затем отправите текстовые данные после этого для автозаполнения. Кто-нибудь есть идеи, если плагин jQuery UI (или любой другой плагин) может сделать что-то вроде этого?

Answer 1

Это действительно возможно. Вы можете нажать на событие автозаполнения виджета (search и select) для достижения этой цели:

var triggered = false; 
var trigger = "TDI:"; 

$("input").autocomplete({ 
    source: [...], 
    search: function() { 
     if (!triggered) { 
      return false; 
     } 
    }, 
    select: function(event, ui) { 
     var text = this.value; 
     var pos = text.lastIndexOf(trigger); 

     this.value = text.substring(0, pos + trigger.length) + 
      ui.item.value; 

     triggered = false; 

     return false; 
    }, 
    focus: function() { return false; }, 
    minLength: 0 
}).bind("keyup", function() { 
    var text = this.value; 
    var len = text.length; 
    var last; 
    var query; 
    var index; 

    if (triggered) { 
     index = text.lastIndexOf(trigger); 
     query = text.substring(index + trigger.length); 
     $(this).autocomplete("search", query); 
    } 
    else if (len >= trigger.length) { 
     last = text.substring(len - trigger.length); 
     triggered = (last === trigger); 
    } 
}); 

Демо здесь: http://jsfiddle.net/andrewwhitaker/kCkga/

Примечание:

• Это очень ограниченное демо , Это не сработает, если вы попытаетесь сделать это автозаполнением в середине строки.
• Чтобы завершить этот пример, вам нужно будет выполнить некоторую работу с вычислением положения курсора в поле ввода и вместо этого вставить туда текст
• Возможно, другие ошибки, но я определенно считаю, что это выполнимо. Надеюсь, вам это поможет.

Answer 2

Я создал для этого плагин, в котором используется автозаполнение jQuery-UI и пример Эндрю (спасибо за это).

Адрес: https://github.com/experteer/autocompleteTrigger

Демо: http://jsfiddle.net/dmattes/2YRgW/1/

$('input,textarea').autocompleteTrigger({ 
    triggerStart : '@', 
    triggerEnd: '', 
    source: [ 
    "Asp", 
    "BASIC", 
    "COBOL", 
    "ColdFusion", 
    "Erlang", 
    "Fortran", 
    "Groovy", 
    "Java", 
    "JavaScript", 
    "Lisp", 
    "Perl", 
    "PHP", 
    "Python", 
    "Ruby", 
    "Scala", 
    "Scheme" 
    ] 
}); 

Best, Daniel