当我将光标放在输入中时模拟 ArrowDown

Question

我在这里努力弄清楚如何实现以及将 Jquery 用于以下目的的方法。

场景：

用户将鼠标光标放在输入上，它必须在该输入中自动模拟按键（KeyCode：40）。此事件用于自动调用仅由该键触发的列表。每当用户将光标放在输入上时，他必须自动模拟按键。目前用户必须点击向下箭头，但我希望这个过程是自动的

$( "#input" ).click(function() {
    $("#input").trigger(jQuery.Event('ArrowDown', { keycode: 40 }));   
});

感谢您的帮助。我在这里没有想法:(

Answer 1

function arrowDown(ev) {
  console.log(`Arrow down by ${ev.type}`);
}

$('input[name="foo"]').on({
  mouseenter: arrowDown,
  keydown(ev) { if (ev.key === "ArrowDown") arrowDown(ev); },
});

<input type="text" name="foo">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

或者直接使用事件：

function arrowDown(ev) {
  if (ev.key === "ArrowDown") {
      console.log(`Arrow down by ${ev.type}`);
  }
}

$('input[name="foo"]').on({
  keydown: arrowDown,
  mouseenter(ev) {
    $(this).trigger( jQuery.Event({type: "keydown", key: "ArrowDown"}) )
  }
});

<input type="text" name="foo">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>