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

Question

Предположим, что у нас есть элемент ввода текста html, и он имеет текст «abc», а курсор находится между «b» и «c». Если мы нажмем клавишу возврата, то как мы можем получить значение «ac»?

Обратите внимание, что в случае специальных клавиш событие KeyPress не срабатывает. Единственными событиями, которые запускаются, являются KeyDown и KeyUp, и ни одно из них не имеет значения после , применяется эффект специального ключа. Эффект виден после выхода обработчиков событий этих событий, но, поскольку у нас есть только эти два события, мы должны каким-то образом получить значение последнего или последнего в этих событиях.

Мы можем пойти сложным путем, вручную применив эффект, но он очень и очень сложен, учитывая тот факт, что нам нужно найти позицию курсора, написать другой код для разных специальных клавиш и обеспечить совместимость браузера. Браузер, какой бы он ни был, уже применяет эффект после выхода из обработчиков событий, но есть ли способ получить это последнее значение в этих событиях, не применяя его вручную или в каком-либо другом событии?

Обратите внимание, что я не ищу "как найти, какая клавиша нажата". Я могу найти это, посмотрев на объект события внутри обработчиков событий KeyDown или KeyUp. Я хочу применить эффект специального ключа без использования большого количества ручного кода.

Я уже смотрел на Захват ввода текста HTML Нажатие клавиши после нажатия клавиши? . Это говорит о другом, чем мой вопрос.

Моя конечная задача - иметь веб-страницу только с двумя элементами управления: текстовым полем и кнопкой. Кнопка изначально отключена. Пользователь может ввести текстовое поле, и для каждого ключа проверяется, есть ли в текстовом поле какой-либо текст; если есть, кнопка включена, если нет, кнопка отключена. Сложность состоит в том, чтобы принять во внимание специальные клавиши, такие как удаление, ввод, табуляция, возврат на одну позицию.

Примечание: Я не хочу работать с обработчиком событий размытия текстового элемента HTML, поскольку он влияет на порядок табуляции.

Answer 1

Пример использования jQuery.Целевое значение хранится в атрибуте title, но вы можете сделать это ajax-запросом или любой другой логикой, которая вам нужна.В следующем случае при вводе 'abc' в текстовом поле будет включена кнопка «Перейти».

HTML:

<input type="text" title="abc" id="in">
<input type="button" id="go" value="Go" disabled="disabled">

Javascript:

$("#in").keyup(function() {
    if($(this).val() == $(this).attr("title")) {
        $("#go").removeAttr("disabled");   
    }
});

JSFiddle