HTML按钮的作用类似于从键盘按下的键，并在某些对象或整个网站上起作用

HTML button act like key pressed from keyboard, and function on certain object or entire website

本文关键字：对象 起作用 网站 类似于 作用 按钮 键盘 HTML      更新时间：2023-09-26

按钮应如下所示：回车键、箭头键、空格键...已经尝试了一些例子。这是其中之一：

var e = $.Event("keydown", { keyCode: 8});
$("#target").keypress();

首先，不会为非打印键触发 keypress 事件，因此箭头键不适用于.keypress()。

来自 jQuery 文档：

当浏览器注册键盘输入时，keypress 事件将发送到元素。这与 keydown 事件类似，不同之处在于修饰符和非打印键（如 Shift、Esc 和 delete）会触发keydown事件，但不触发keypress事件。根据平台和浏览器的不同，这两个事件之间可能会出现其他差异。

相反，您可能希望使用 .keydown() 或 .keyup() .但是，与其尝试在单击按钮时触发keydown或keyup事件，为什么不编写一个函数来执行您想要的操作，并在按下键或单击按钮时调用该函数呢？

例如，假设您希望在按下左键或左键按钮时字符向左移动，则可以编写以下函数：

var moveLeft = function() {
   alert('Moving character left one position');
};

然后，您可以在按下左键或单击左键时调用该函数。

$('#left-btn').click(moveLeft);
$('body').keydown(function(e) {
    if (e.keyCode == 37) {
        moveLeft();
    }
});

工作示例：

单击向左或向

右按钮或按向左或向右箭头键时检查浏览器的 JavaScript 控制台。

$(document).ready(function() {
  var moveLeft = function() {
    console.log('Moving left!');
  };
  var moveRight = function() {
    console.log('Moving right!');
  };
  $('body').keydown(function(e) {
    switch (e.keyCode) {
      case 37:
        moveLeft();
        break;
      case 39:
        moveRight();
        break;
    }
  });
  
  $('#left-btn').click(moveLeft);
  
  $('#right-btn').click(moveRight);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <button id="left-btn">&larr;</button>
  <button id="right-btn">&rarr;</button>
</div>

相关文章：