问题描述
我们的应用在 IE 中存在一个问题,即用户在非文本控件上无意中按退格键会导致导航和问题。我的任务是抑制退格。但我们是一个需要符合 508 标准的应用程序。可访问性很重要。抑制退格键不会损害我们的可访问性吗?如果是这样,Chrome 和 Edge 就没有这个问题。他们不使用相同的键盘快捷键吗?
解决方法
Alt + 左箭头 是大多数较新浏览器的标准后退按钮。
由于这也适用于 IE,因此用户仍然可以使用键盘导航回来。
从技术上讲,这可能被视为失败,因为您干扰了预期的行为,但我个人认为,如果您决定禁用 backspace 键,则整个表单消失的不便胜过当前选择的输入是空的就可以了。
确保这仅在当前选择了 <input>
(或 <textarea>
)时才停止正常的 backspace 行为(或 document.activeElement
)。
这样,如果用户没有选择输入,他们仍然可以使用 backspace 返回。
无需禁用退格键
的“全能”解决方案无需禁用 backspace 按钮即可解决此问题的一种方法是使用 window.onbeforeunload
;
创建一个设置为 false
的标志,如果任何输入具有值/进行了更改等,则该标志会更改为 true
。
然后使用 window.onbeforeunload
并检查该标志的值。如果是 true
,则显示消息,false
并返回 null
,因此不会显示警告。
以下示例应该可以一直运行到 IE9 并在允许导航之前发出警告。
无论如何我都鼓励您实现这一点 - 意外关闭页面、误按物理后退按钮等很容易,因此这样做可以防止所有意外导航。 >
var changed = false; // change it to true if an input has a value / has changed.
window.onbeforeunload = function() {
return changed ? "Are you sure you want to navigate away? Unsaved changes will be lost." : null;
}
,
由于存在意外数据丢失的风险,Edge 和 Chrome 自愿禁用退格键以返回历史。
这已于 2018 年 10 月从 Edge 和 Chrome 52 中删除。
禁用它是完全正确的,因为它旨在保护您的用户。