javascript - 按键时更改 div 中的数据

Question

我正在尝试根据箭头选择来选择元素。我在列表中有一个 div 和三个元素。现在我想第一次选择第一个元素，当按下键时，选定的元素移动到下一个 li，与第三个 li 相同，反之亦然，反之亦然。

HTML

<div id='divText'><div>
<ul>
<li>ABC<li>
<li>XYZ<li>
<li>CDE<li>
<li>FGH</li>
</ul>

JS

$('#divText').on("keyup", function(e) {
      var code = e.which;
      if (code == 40) 
           $('#divText').html($('ul li').html());
      else if (code == 38) {
           $('#divText').html($('ul li').html());
 });

现在我很困惑我们如何获得 ul 的下一个和上一个元素

Answer 1

HTML：

<input id='divText' type="text"/>
 <ul id="list">
  <li>ABC</li>
  <li>XYZ</li>
  <li>CDE</li>
  <li>FGH</li>
 </ul>

JS：

var index = 0;
$('#divText').on("keyup", function(e) {
  var code = e.which;
  var max = $('#list').children().length;
  if (code == 40){
    index++;
    if(index == max){
      index = 0;
    }
  } else if (code == 38) {
    index--;
    if(index < 0){
      index = max-1;
    }
  }
  document.getElementById('divText').value = ($('#list').children().eq(index).text());
});

...我错过了第一个答案中的问题