web-dev-qa-db-ja.com

テキストエリアにキーを入力してください

私はtextareaを持っています、毎回 Enter textareaで押されたキー改行(*)で新しい行を開始したい。それについてどうやって行くのですか?

JQueryを使用しないでください。

私は観察することができます Enter キー、その後!? textareaの値全体を取得し、それに*を追加し、再度textareaを埋める必要がありますか?

21
sat

次のようなことができます:

<body>

<textarea id="txtArea" onkeypress="onTestChange();"></textarea>

<script>
function onTestChange() {
    var key = window.event.keyCode;

    // If the user has pressed enter
    if (key === 13) {
        document.getElementById("txtArea").value = document.getElementById("txtArea").value + "\n*";
        return false;
    }
    else {
        return true;
    }
}
</script>

</body>

Enterを押してからの新しいラインキャラクターフィードはまだ存在しますが、必要なものを取得するための開始点です。

27
williamtroup

このタッドをテキストエリアに追加するだけです。

onkeydown="if(event.keyCode == 13) return false;"

ユーザーがEnterキーを押すのは、最後だけでなく、テキストの中央で行う場合を考慮する必要があります。 keyupイベントでEnterキーを検出することをお勧めします。提案どおり、正規表現を使用して、値が必要なものであることを確認してください。

<textarea id="t" rows="4" cols="80"></textarea>
<script type="text/javascript">
    function formatTextArea(textArea) {
        textArea.value = textArea.value.replace(/(^|\r\n|\n)([^*]|$)/g, "$1*$2");
    }

    window.onload = function() {
        var textArea = document.getElementById("t");
        textArea.onkeyup = function(evt) {
            evt = evt || window.event;

            if (evt.keyCode == 13) {
                formatTextArea(this);
            }
        };
    };
</script>
7
Tim Down

私のシナリオは、ユーザーがテキストエリアに入力しているときにEnterキーを打ったとき、改行を含める必要があります。私はこれを以下のコードを使用して達成しました......

function CheckLength()
{
    var keyCode = event.keyCode
    if (keyCode == 13)
    {
        document.getElementById('ctl00_ContentPlaceHolder1_id_txt_Suggestions').value = document.getElementById('ctl00_ContentPlaceHolder1_id_txt_Suggestions').value + "\n<br>";
    }
}
3
MuraliKrishna

次のようなことができます:

$("#txtArea").on("keypress",function(e) {
    var key = e.keyCode;

    // If the user has pressed enter
    if (key == 13) {
        document.getElementById("txtArea").value =document.getElementById("txtArea").value + "\n";
        return false;
    }
    else {
        return true;
    }
});
<textarea id="txtArea"></textarea>
0
QuyPham