如何使用 jQuery 和/或 JavaScript 創建文本區域？

Question

我需要使用 jQuery 和/或 JavaScript 創建一個文本區域。

我正在使用此代碼（ click here for preview ），但退格、回車、符號和小寫字母不起作用。 為什么？：

<!DOCTYPE html>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <meta charset=utf-8 />
        <title>TEST</title>
        <!--[if IE]>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <script type="text/javascript">
        <!--
            $(document).keyup(function (event) {
                var keyCode = event.keyCode;
                $('#mytext').text(function (i, text) {
                    return text + String.fromCharCode(keyCode);
                });
            });
        // -->
        </script>
        <style>
            #cmd {
                position: relative; 
                font-family: courier;
                font-weight:bold;
                font-size: 14px;
                padding: 5px;
                overflow: hidden;
            }
            #mytext {
                float: left; 
                padding-left: 3px;
                white-space: pre;
            }
        </style>
    </head>
    <body>
        <div id="cmd">
            <br>
            <div id="mytext">hello </div>
        </div>
    </body>
</html>

Answer 1

為什么不讓這些鍵調用一個函數來將 html 放在<div id="cmd"></div>之間

我找不到按鍵事件功能，但這應該給你一個想法

if (keycode==31) {
    $("#cmd").append("<br/>");
}

31 是輸入代碼。

看這里，他們在按鍵上討論 jquery 函數：
jQuery Event Keypress：按下了哪個鍵？

Answer 2

寫這種類型的代碼輸入鍵的例子這個工作正常

$(document).keyup(function(event) {
  var key = event.which;
  var text = $('#mytext');
      if (key === 13) {
        $(text).append("<br/>");
     } else {
       $(text).append( String.fromCharCode(keyCode));
     }
});

http://jsbin.com/obuya3/8/edit

Answer 3

對於 keydown 和 keyup 事件，您可以通過查看 event.keyCode 並或多或少地假裝它是 ASCII 代碼來識別最常用的鍵（字母、數字和其他一些鍵）。 然而，事實並非如此，許多 Javascript 手冊說可以通過執行“String.fromCharCode(event.keyCode)”將其轉換為字符是錯誤的。 在 keydown 和 keyup 事件上，鍵碼不是字符碼，這種轉換會給許多鍵帶來狂野的結果。 沒有通用的可移植方式將鍵碼轉換為字符。 您幾乎必須感知瀏覽器類型並以此為基礎進行鍵映射。

來自http://unixpapa.com/js/key.html

為什么不使用帶有一些樣式的文本區域？

Answer 4

return text + String.fromCharCode(keyCode); 將一個字符串附加到另一個字符串。 退格鍵和其他控制鍵不附加字符串，它們會刪除字符/移動插入符號。 在這種情況下，您應該自己處理這些 keyCode。 您還可以將內容指定為editable ，然后瀏覽器處理所有控制鍵（如所見即所得編輯器）。

參見：http: //jsbin.com/obuya3/4示例

Answer 5

我不是關於你的問題。

如果你想用jquery創建一個textarea，有很多方法。

$("#cmd").append("");

或者你想使用 DOM。

Answer 6

如果您使用 HTML5，則可以使用“contenteditable”屬性。

如何使用 jQuery 和/或 JavaScript 創建文本區域？

問題描述

6 個解決方案

解決方案1
1 已采納 2010-09-21 09:34:54

解決方案2
0 2014-03-24 08:23:59

解決方案3
0 2010-09-21 08:51:49

解決方案4
0 2010-09-21 08:51:54

解決方案5
0 2010-09-21 08:52:11

解決方案6
0 2010-09-21 09:55:44

如何使用 jQuery 和/或 JavaScript 創建文本區域？

問題描述

6 個解決方案

解決方案1 1 已采納 2010-09-21 09:34:54

解決方案2 0 2014-03-24 08:23:59

解決方案3 0 2010-09-21 08:51:49

解決方案4 0 2010-09-21 08:51:54

解決方案5 0 2010-09-21 08:52:11

解決方案6 0 2010-09-21 09:55:44

解決方案1
1 已采納 2010-09-21 09:34:54

解決方案2
0 2014-03-24 08:23:59

解決方案3
0 2010-09-21 08:51:49

解決方案4
0 2010-09-21 08:51:54

解決方案5
0 2010-09-21 08:52:11

解決方案6
0 2010-09-21 09:55:44