Как заставить нажатие клавиши соответствовать функции, которая вызывается первой в javascript - PullRequest
Новая
       23

Как заставить нажатие клавиши соответствовать функции, которая вызывается первой в javascript

0 голосов
/ 06 февраля 2020

Итак, я пробую что-то, если у вас есть две функции, которые вы хотите вызвать после нажатия одной и той же клавиши, вот так: 

    var plus = function () {
    document.addEventListener("keyup", function(e) {
        if (/[+]/g.test(e.key)) {
            console.log("plus");
        }
    })
    }

    plus();

    var minus = function() {
        document.addEventListener("keyup", function(e) {
            if (/[-]/g.test(e.key)) {
                console.log("minus");
            }
        });
    }

    minus();

    function check() {
        document.addEventListener("keyup", function(e) {
            if(plus) {
                if (e.keyCode == 13) {
                    console.log("enter pressed after plus");
                    plus = false;
                    minus = function() {
                        document.addEventListener("keyup", function(e) {
                            if (/[-]/g.test(e.key)) {
                                console.log("minus");
                            }
                        });
                    }
                }
            } else if(minus) {
                if (e.keyCode == 13) {
                    console.log("enter pressed after minus");
                    minus = false;
                    plus = function () {
                        document.addEventListener("keyup", function(e) {
                            if (/[+]/g.test(e.key)) {
                                console.log("plus");
                            }
                        })
                    }
                }

            }
        });
    }

    check();

Если вы сначала нажмете минус, то введите console.log("enter pressed after plus") всегда вызывается во-первых, из-за порядка кода, хотя я хочу, чтобы ввод соответствовал клавише, которую я нажимаю в первую очередь, если сначала нажать плюс, то я хочу, чтобы позвонили console.log("enter pressed after plus"), и если я нажму минус сначала, тогда я хочу, чтобы позвонили console.log("enter pressed after minus").

Любая помощь будет признательна, и спасибо заранее.

О, также извините за глупое название, не могу придумать лучшего .

1 Ответ

1 голос
/ 06 февраля 2020

Чтобы очистить это немного (сохранить DRY), вы можете переместить все logi c обработчика событий в одну функцию и использовать один прослушиватель.

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

Кроме того, свойство KeyboardEvent.keyCode устарело. Вместо этого следует использовать свойство KeyboardEvent.code.

Пример 

const input = document.querySelector('input')
const log = document.getElementById('log')

function check() {
  let lastKey = null

  input.addEventListener('keyup', ({ key }) => {
    if (['+', '-', 'Enter'].includes(key)) { // we only care about these keys
      if (key === '+') log.textContent = 'plus'
      if (key === '-') log.textContent = 'minus'
      if (key === 'Enter') { // `Enter` was keyed, what was keyed last?
        if (lastKey === '+') log.textContent = 'enter pressed after plus'
        if (lastKey === '-') log.textContent = 'enter pressed after minus'
      }

      lastKey = key // current key becomes last key
    }
  })
}

check()
<input placeholder="Click here, then press and release a key." size="40">
<p id="log"></p>
...