JS / jQuery: лучший способ получить напечатанные символы после '#' в текстовой области

Question

Я создаю интеллектуальную текстовую область, которая должна распознавать термин, набранный после символа «#». Это должно быть в состоянии работать с термином ВРЕМЕННО набираемым и иметь возможность работать с несколькими экземплярами 'Символ # в одной текстовой области.

Он предназначен для работы так же, как Facebook, когда вы вводите символ '@', чтобы пометить человека в сообщении.Появится раскрывающийся список, и элементы списка будут отфильтрованы в зависимости от термина после символа «#».

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

Каков наилучший способ достижения этой функциональности?

Answer 1

Не знаю, поможет ли это, но вот небольшой скрипт для поиска хешей.
http://jsfiddle.net/aNgVV/

Answer 2

Изначально вам нужно отлавливать нажатие клавиши «#», а затем фиксировать последующие нажатия клавиш и передавать их в функцию для обработки ваших требований автозаполнения.Грубый набросок кода приведен ниже.Вам также может понадобиться перехватывать нажатия пробельных клавиш, чтобы остановить автозаполнение.

var hashKeyPressed = false;

$('#TextArea').keyup(function(event) {
    if(event.keyCode == '222') {
        // this will catch the '#' key
        hashKeyPressed = true;
    }
    if(hashKeyPressed) {
        // Here you can start build up subsequent key presses into a string
        // and pass them to a function to handle the auto-completion
    }
}); 

Answer 3

Я предлагаю вам посмотреть демонстрацию пользовательского интерфейса jQuery для виджета автозаполнения, в частности демонстрацию для с использованием удаленного источника данных с кешем .В частности, по следующим причинам:

1. Он автоматически позаботится о упомянутом вами раскрывающемся виджете.
2. Он демонстрирует, как можно заполнить этот раскрывающийся список элементами, основанными на AJAX.call (который, я полагаю, вам нужен).
3. Демонстрация для кэширования автозаполнения анализирует текст в элементе INPUT, поскольку он пытается определить, было ли уже кэшировано значение, набираемое пользователем в данный момент,и реагирует соответственно.Я предполагаю, что вы можете сделать что-то похожее, чтобы проверить типы # и проверить, изменяется ли также предыдущий тег #.

Answer 4

Вы можете захватить событие keyup и проверить, что было введено последним, следующим образом:

       $('#myTextArea').keyup(function () {

            var len = $(this).val().length;

            if ($(this).val().substring(length - 1, 1) == '#') {

                // Do whatever you want to do here

            }

        });

РЕДАКТИРОВАТЬ:

Вы правы - вы можете сделать этовместо этого:

$('#myTextArea').keypress(function (e) {

    if (e.which == 222) {

        // do something here

    }

});