Disable Chrome's text input undo/redo (CTRL+Z

2019-04-30 03:32发布

i'm currently developing a web application and i encounter a problem. As you might know or not, chrome has a feature that gives <input> (especially text inputs) an "undo" function when you hit CTRL+Z and "redo" with CTRL+Y it may seem like a good feature in normal websites, but currently i'm making an image editor that also uses those keyboard shortcuts (CTRL+Z & CTRL+Y).

in my app i also have a text input, so when i change the text input's content and then hit CTRL+Z to undo the changes in my image editor, it would undo the change in the text editor instead!

here is a Codepen that would demonstrate the effect
(instruction is in the Codepen)

So in conclusion i want to remove the undo/redo function in chrome how can i do that?

标签： javascript html google-chrome undo textinput

2条回答

三岁会撩人

2楼-- · 2019-04-30 04:05

var ctrlDown = false;
var ctrlKey = 17, vKey = 86, cKey = 67, zKey = 90;

document.body.onkeydown = function(e) {
  if (e.keyCode == 17 || e.keyCode == 91) {
    ctrlDown = true;
  }
  if ((ctrlDown && e.keyCode == zKey) || (ctrlDown && e.keyCode == vKey) || (ctrlDown && e.keyCode == cKey)) {
    e.preventDefault();
    return false;
  }
}
document.body.onkeyup = function(e) {
  if (e.keyCode == 17 || e.keyCode == 91) {
    ctrlDown = false;
  };
};

<body>
    <input type='text' value='test' />
</body>

Does this work?

Stolen from here, found on here as a comment by @KadeHafen.

0人赞添加讨论(0) 举报

你好瞎i

3楼-- · 2019-04-30 04:24

You could use onkeydown event, and preventDefault.. eg.

document.onkeydown = function(e) {
  if (e.ctrlKey && e.key === 'z') {
    e.preventDefault();
    alert("CTRL + Z!");
  }
}

0人赞添加讨论(0) 举报

Disable Chrome's text input undo/redo (CTRL+Z

采纳回答

编辑标签

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮

付费偷看金额在0.1-10元之间