Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Добавление тегов как на ютубе (https://javascript.ru/forum/dom-window/44914-dobavlenie-tegov-kak-na-yutube.html)

artem328 06.02.2014 14:46

Добавление тегов как на ютубе
 
Здравствуйте все,

Подскажите, каким образом можно сделать добавление тегов как на ютубе. То есть в поле ввода вводим тег и после добавления запятой, только что написанный тег уже пишется в рамочке с кнопкой "удалить". Скриншот для наглядности

Спасибо

artem328 06.02.2014 14:53

глянув код на ютубе, я понял, что в див добавляется значения перед инпутом после написания "," и я так понимаю происходит это с помощью ajax, а как сделать чтоб после написания запятой срабатывала отправка?

ksa 06.02.2014 15:00

Цитата:

Сообщение от artem328
я понял, что в див добавляется значения перед инпутом после написания "," и я так понимаю происходит это с помощью ajax

Для добавления дива перед инпутом ajax не нужен...

artem328 06.02.2014 15:12

Подскажите, тогда как реализовать данную систему

ksa 06.02.2014 16:20

Цитата:

Сообщение от artem328
как реализовать данную систему

Так ты же уже описал алгоритм. :)
- отлавливать нажатие кнопок
- если обнаружен символ-сепаратор
* добавлять див перед инпут
* заполнять див значением из инпута
* очищать инпут

artem328 06.02.2014 16:23

Я с javascript пока не сильно дружу. Какие функции нужно посмотреть, чтоб отлавливать нажатие кнопок и отслеживать символ-разделитель?

ksa 06.02.2014 16:35

Цитата:

Сообщение от artem328
Какие функции нужно посмотреть, чтоб отлавливать нажатие кнопок

На то есть события key*()... Как вариант keyup()...

Цитата:

Сообщение от artem328
отслеживать символ-разделитель?

Как вариант...

var val='111,222';
if (val.search(/,/g) == -1) {
	alert('Запятой нет...');
} else {
	alert('Запятая есть!');
};

artem328 06.02.2014 16:42

ksa,
спасибо
буду разбираться

kostyanet 06.02.2014 16:48

Цитата:

Сообщение от ksa
Для добавления дива перед инпутом ajax не нужен...

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


Часовой пояс GMT +3, время: 15:35.