Создайте текстовый ввод, который меняет код смайлика на изображение

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

Как мне это сделать?


javascript html jquery
person Elham Gdz    schedule 14.01.2014    source источник
comment
Этот вопрос может быть вам полезен stackoverflow.com/questions/917610/   -  person charliefortune    schedule 14.01.2014
comment
@charliefortune: нет, я хочу, чтобы когда я пишу код смайлов внутри этого поля, поле ввода заменяло этот код на картинку.   -  person Elham Gdz    schedule 14.01.2014
comment
Я знаю, но свойство css background-image может подойти для этого. Кроме того, в своем вопросе вы должны сообщить нам, что вы уже пробовали.   -  person charliefortune    schedule 14.01.2014

Ответы (2)


arrow_upward
0
arrow_downward

Я уже сталкивался с этим запросом раньше. Существует цепочка, идущая по одному и тому же запросу.

Это не так просто, как вы пытаетесь представить. Писать и конвертировать вообще не имеет смысла.

ПОДХОД: Вы должны прочитать каждый текст, введенный пользователем, если он соответствует шаблону улыбки, и если смайлик соответствует, затем извлеките соответствующий .gif из папки с изображениями.

Пожалуйста, перейдите по следующей ссылке для быстрого старта.

Замените список смайликов их изображениями

person Vinayak Pingale    schedule 14.01.2014

arrow_upward
0
arrow_downward

Этот ответ может быть довольно поздним, но этот вопрос по-прежнему занимает высокое место в Google...

Самый простой способ добавить эту функцию — использовать подключаемый модуль SCEditor (лицензия MIT). Это решение на основе JavaScript и CSS, которое превращает любую текстовую область в WYSIWYG-редактор. Если панель инструментов отключена (см. http://www.sceditor.com/documentation/options/), вы получаете ввод текста, который автоматически заменяет смайлики соответствующими изображениями.

Подсказка: может потребоваться указать скрипту, где найти смайлики, используя параметр emoticonsRoot (у меня ушло 10 минут, чтобы выяснить это - 10 из 30 минут, необходимых для того, чтобы найти SCEditor и заставить его работать...).

person BurninLeo    schedule 01.07.2015