在浏览器中禁用退格导航答案

【问题标题】：Disable backspace navigation in browser在浏览器中禁用退格导航
【发布时间】：2015-08-27 19:59:49
【问题描述】：

有人知道如何禁用使用键盘上的“退格”键导航到上一页的功能吗？

现在，我有一个发票类型的 Web 应用程序，如果用户（在 Mac 上）点击退格键删除表单字段中的元素，在到达输入项目的末尾后，如果他们再次点击退格键，它会移动到之前浏览过的页面，使他们丢失输入的应用程序的数据。

【问题讨论】：

【解决方案1】：

window.onkeydown = function(e) {
  if (e.keyCode == 8 && e.target == document.body)
    e.preventDefault();
}

解释：退格键的键码为 8。调用“preventDefault”意味着该事件不会导致按退格键的默认行为（即导航返回页面）。仅当事件的目标是文档的主体时才会发生此行为。

编辑：jsfiddle example

【讨论】：

我是否只需在表单字段之前的
这会干扰文本框中的退格。我对这个问题的理解是，Steven 只是试图防止退格键用于在页面堆栈中向后导航，但应该允许退格键的其他用途。
第二条上面的评论，我希望用户仍然可以使用退格，只是不能使用退格离开页面...
你去 - 现在它允许你像往常一样使用退格键。这应该放在中

【解决方案2】：

@Sam 的答案的缺点是，如果您单击 HTML 元素（例如表格），Backspace 键仍会将您返回。它仅在您单击没有任何 HTML 元素的“空白空间”时才有效。

我调整了 Sam 的答案并从 this answer 获取代码来创建此解决方案。它并不涵盖所有边缘情况，但对于我的用例来说已经足够了。

function disableBackspaceNavigation() {
  window.onkeydown = function(e) {
    if (e.keyCode == 8 && !isTextBox(e.target)) e.preventDefault();
  }
}

function isTextBox(element) {
  var tagName = element.tagName.toLowerCase();
  if (tagName !== "input") return false;

  var typeAttr = element.getAttribute('type').toLowerCase();
  return typeAttr === 'text';
}

【讨论】：