时间戳

首页 > 解决方案 > preventDefault 输入键事件而不阻止滚动

javascript - preventDefault 输入键事件而不阻止滚动

问题描述

我想阻止除滚动之外的默认操作。当我添加e.preventDefault事件keyDown（Enter键）时，它还会阻止浏览器滚动。我想阻止除了滚动之外的输入按键操作。有没有办法区分输入键事件和滚动？或者我们可以部分阻止滚动应该起作用的默认操作，而其他操作被阻止。任何帮助将不胜感激。

document.getElementById('textBox').addEventListener("keydown", function(event) {
    // Number 13 is the "Enter" key on the keyboard
        if (event.keyCode === 13) {
            // Cancel the default action, if needed
            event.preventDefault();
        }
    });

我preventDefault在输入动作中添加了。出于某种原因，我必须将此行添加到代码中，但这也阻止了我的页面滚动。我想保留preventDefault，但我的页面应该滚动。有什么办法吗？

标签： javascriptdomscrolldom-eventskeydown

解决方案

每当触发事件时，只需在 textarea 中添加一个新行。

document.getElementById('textBox').addEventListener("keydown", function(event) {
  // Number 13 is the "Enter" key on the keyboard
  if (event.keyCode === 13) {
    var cursor= this.selectionEnd;
    this.value = this.value.substring(0, cursor) + '\n' + 
    this.value.substring(cursor);
    this.selectionEnd = cursor+1;
    event.preventDefault();
  }
});
<textarea style="height:200px;width:300px" id="textBox"></textarea>

注意：contenteditable我注意到在这种情况下使用的是 OP 。这是 OP 的 JSFiddle 的一个分支。我对使不同的元素可编辑进行了一些更改，因为这似乎更合适。

推荐阅读