Как нажимать клавишу вниз или вверх по списку, чтобы вызвать фокус на элементе внутри слушателя событий? - PullRequest
0 голосов
/ 26 мая 2019

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

Я помещаю свойство firstChild в поле searchSuggest внутри прослушивателя событий при нажатии клавиши со стрелкой вниз, однако он будет запускать метод focus() для первого дочернего элемента или элемента списка при каждом нажатии, а не следующий брат в списке.

  const d = document,     
    searchBox = d.getElementById("PFsearchBox"),
    searchSuggest = d.getElementById("PFsearchSuggest")


  searchBox.addEventListener("keydown", e => {
    // up arrow
    if (e.which === 38) {
        e.preventDefault();
        // select the last item in the suggestion list
        searchSuggest.children[searchSuggest.children.length - 1].focus()
    }

    // down arrow
    if (e.which === 40) {
    e.preventDefault();
    searchSuggest.firstChild.focus()
    }
  });

Я ожидаю, что при нажатии клавиши со стрелкой вниз фокус переходит от поля ввода к первому дочернему элементу списка в узле searchSuggest, а затем последовательно вниз по списку при каждом нажатии клавиши со стрелкой вниз, и наоборот при нажатии клавиши со стрелкой вверх. Image of the HTML Markup of the DOM nodes

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...