7

我正在编写一个需要模拟文本区域的应用程序。我知道如何处理它的唯一方法是捕获关键事件的 keyCode。将如何获取该 keyCode 并在支持 utf-8 的情况下将其应用于画布?

干杯

4

3 回答 3

10

这似乎是个坏主意,因为除了文本输入之外,textarea 免费为您提供了很多(插入符号、选择、剪切、粘贴、拖放、箭头键处理等),但这里有两件事你需要做 :

  1. 给你<canvas>一个tabindex属性,以便它可以接收焦点并因此引发关键事件;
  2. 向元素添加keypress(not keydown) 处理程序以<canvas>捕获文本输入。

代码:

<canvas id="textarea" tabindex="1" width="300" height="200"></canvas>

<script type="text/javascript">
   var el = document.getElementById("textarea");
   el.onkeypress = function(evt) {
       var charCode = evt.which;
       var charStr = String.fromCharCode(charCode);
       alert(charStr);
   };
</script>
于 2010-09-16T17:22:50.387 回答
3

使用 jquery:

<div id="myTextArea></div>

$('#myTextArea').keypress(function (event) {

    $('#myTextArea').append(String.fromCharCode(event.which));

});
于 2010-09-16T17:26:36.623 回答
1

你见过贝斯平吗?它不仅仅是文本区域的替代品,而且它基本上可以满足您的需求。您当然可以查看代码和文档,或者如果它符合您的需要,就使用它。

于 2010-09-16T17:20:42.607 回答