Запустите нажатие клавиши с помощью jQuery ... и укажите, какая клавиша была нажата

Я хотел бы иметь элемент ввода (type = text) или элемент textarea, который проверяется динамически, вызывая определенные нажатия клавиш. Это будет использоваться для ввода китайского пиньинь, например:

Пользователь вводит "ma2" в элемент ввода. Событие нажатия клавиши запускается при каждом нажатии клавиши, а 2 никогда не появляется. Вместо этого, когда пользователь нажимает «2», «а» получит тональный знак, например: «á». В конце концов, пользователь наберет: «má».

Это может быть выполнено путем чтения и изменения всего входного значения с помощью $ (element) .val (), однако, когда входной элемент имеет фокус и его значение устанавливается путем вызова .val ("что-то"), курсор перемещается в конец текста. Это отлично работает в большинстве ситуаций, потому что пользователь просто продолжает вводить текст в конце поля, но я хочу, чтобы это работало в ситуациях все.

... другим решением этой проблемы было бы получение / установка местоположения курсора в элементе input или textarea. Однако я не думаю, что это возможно в javascript.


Итак, Реми точно был на правильном пути. В любом случае, запуск нажатия клавиш не позволил бы мне вводить специальные символы без особых хлопот. Вместо этого я перехватываю событие keydown и устанавливаю значение input / textarea, а затем перемещаю курсор.

Я не нашел ничего хорошего для получения / настройки каретки в jQuery, но следующее действительно сломало эту проблему для меня. Я отправлю ссылку на мой последний входной код пиньинь, когда он станет стабильным. Сейчас это довольно близко.

http://blog.vishalon.net/Post/57.aspxhttp://demo.vishalon.net/getset.htm

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
4
0
10 481
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Возможно, вам не повезет с запуском нажатия клавиш - я почти уверен, что, если нажатие клавиши не является доверенным (то есть исходит из браузера), оно не будет принято.

Однако вы можете заменить текст и вставить карат на место, вместо того, чтобы стрелять до конца строки. Вам нужно использовать setSelectionRange и createTextRange (для IE).

Я собрал небольшую демонстрацию - замены, которые вы увидите, не соответствуют реальным словам, но они показывают, как это работает:

http://jsbin.com/emudi/ (для редактирования источника http://jsbin.com/emudi/edit)

Хитрость заключается в том, чтобы запомнить, где находится карат, заменить найденное слово с помощью substr (вместо регулярного выражения, чтобы избежать замены неправильных совпадений), а затем переставить карат в конце нового слова.

Замена срабатывает по нажатию пробела или размытию прочь. Примечание по этому поводу - вы можете инициировать замену для определенного символа (например, «2»), но я бы не рекомендовал искать замену при нажатии клавиши каждый.

Кроме того, для простого кода, управляющего "кареткой" в кросс-браузере, это может быть полезно:

http://javascript.nwbox.com/cursor_position/

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

Другие вопросы по теме