Функция автозаполнения / добавления тегов для обновления статуса Facebook с помощью jQuery

Question

Я хотел бы создать текстовый ввод, такой как обновление статуса Facebook Publisher.По сути, ввод, который может активировать функцию тегирования / автозаполнения с определенной клавишей (например, @), создавая теги, которые действуют как отдельные символы при вводе текста (могут быть удалены с помощью одного возврата на одну позицию), и при этом все еще принимает регулярный ввод текста,В отличие от Facebook, я хотел бы принять только один такой «тег» и принять его только в начале ввода.

Кажется, что наиболее жизнеспособный вариант - использовать jQuery - это contenteditable div.Тем не менее, я понятия не имею, что делать с jQuery оттуда.Кто-нибудь может помочь мне начать?Спасибо.

Answer 1

Плагин токенизации автозаполнения в первом ответе не выполняет в точности то, что задает вопрос.Этот плагин позволит вам только создать список результатов поиска без регулярного текста между ними.

В итоге я написал собственное решение, которое можно найти здесь:

http://www.hawkee.com/snippet/9391/

Answer 2

Надеемся, что к настоящему моменту (через 6 с лишним лет) вам удалось найти подходящее существующее решение для ваших нужд или вы смогли развернуть свое собственное. Если вы этого не сделали, я подумал, что следующее будет вам полезно, и те, кто наткнулся на это здесь, смотрят либо такое решение.

Утилита управления "упоминанием" состоит из 3 компонентов:

1. Модуль автозаполнения : Компонент, отвечающий за получение и отображение набора элементов, которые можно использовать для создания упоминания, с учетом строки.

2. Модуль отслеживания упоминаний : компонент, отвечающий за отслеживание данных, связанных с упоминанием; Как минимум, местоположение, а также поверхностные и существенные (если они существуют) значения каждого упоминания должны отслеживаться во всех модификациях текста элемента ввода, к которому прикреплена утилита.

3. Модуль визуального разграничения упоминания : Компонент, отвечающий за различие текста упоминания от остального текста в элементе ввода, к которому прикреплена утилита

Надеюсь, что поломка такой утилиты даст вам представление о том, как развернуть ее собственную реализацию.

Если вы предпочитаете использовать существующую надежную реализацию, взгляните на Mentionator , который поддерживается этим парнем прямо здесь :).

Answer 3

мой друг столкнулся с этой "проблемой" на прошлой неделе.В конце концов он использовал этот плагин, который говорит сам за себя:

http://github.com/loopj/jQuery-Tokenizing-Autocomplete-Plugin