javascript - 如何在 textarea 中使用 keydown 事件？

Question

我不太习惯使用 javascript，但我已经厌倦了在工作中手动重复品尝。当我在论坛上写作时，我需要一个快速的简短命令，例如 Ctrl-Alt-z，将一些文本插入到 textarea 对象中。

我已经编写了一个在文本光标 insertAtCursor(text) 处插入文本的函数。文本区域的 ID 是“内容”。

我知道如何解决检查组合键的问题。我遇到的问题基本上是检查任何键盘输入。

我尝试了以下方法：

document.keydown(function(event){
  alert("Test");
});

但是，它不起作用。

提前致谢！

Answer 1

如果您正在寻找跨浏览器解决方案，我认为您将遇到困难。这里有一些可以帮助你的东西：http ://www.quirksmode.org/dom/events/keys.html

基本上，你会想要这样的东西：

document.getElementById('content').addEventListener('keydown', function (e){
    // Do your key combination detection
}, false);

MDN 关于事件。可能更有帮助

Answer 2

var textarea = document.getElementById('textarea');

textarea.onkeydown = function ()
{
   alert("Test");
};

使用 jQuery（委托）。

$("body").delegate("textarea", "keydown",function(e){
        alert("Test");
        //code logic goes here
        //if(e.which == 13){
        //Enter key down    
    }
});

或者

$('textarea').live("keydown", function(e) {
    alert("Test");
    // e.which is which key, e.g. 13 == enter
});

在线文档。事件文档。

Answer 3

document.querySelector('textarea') // find a DOM element (by tag name at this case)
  .addEventListener('keydown', // bind an event listener for "keydown" event
    e => { // declare a callback function when that event happens
      console.log(e.target.value) // print the target node value (<Textarea>)
    })

<textarea></textarea>