textarea入力、文字数、行数の制限。

Question

初めまして。
サイトフォームのtextarea入力欄で、
「全文字144文字、1列24文字、行数6行」の制限として作成しております。

長文を入力する時は1列24文字を入力し、25文字目に折り返しはされるのですが、
短文を5文字入力した後に「Enter」キーで改行ができなく、縦線ポインターが強制的に最後の文字に戻されてしまいます。

何卒、お力をお貸しいただけますと幸いです。

■htmlソースコード
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

<textarea id="areatxt" name="inquiry" cols="24" rows="6" wrap="soft" maxlength="144"></textarea>

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

■現在のJavaScriptになります。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

<script> document.getElementById("areatxt").onkeyup = function() { var text = this.value.replace("\n", ""); if (text.length > 24) { var chunks = text.match(/.{1,24}/g); if (chunks.length > 6) { chunks.splice(6, chunks.length - 1); alert("テキストは6行までとなります。"); } this.value = chunks.join("\n"); } }; </script>

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

よろしくお願いいたします。

Answer 1

短文を5文字入力した後に「Enter」キーで改行ができなく、縦線ポインターが強制的に最後の文字に戻されてしまいます。

そういうコード（手入力した改行は全部削除して、24文字目に統一する）を書いているので、その通りに動いています。

Comments

[退会済みユーザー]

ご返答ありがとうございます。

JavaScriptには、あまり詳しくはないのですが、
こちらのコードで、短文入力で改行ができるようにできないかと
色々と試し模索しておりましたが、
なかなか、上手くいかずこちらを頼ってしまった次第ございます。

[maisumakun]

まずは、「どう動かしたいか」を先に考えましょう。

例えば、「元が24文字/6文字の2行になっているときに、1行目に追記したらどうするか」とか、あらゆるパターンに対して的確な動作を考え、それを実装していかないといけません。

入力中に動的に入力したものを変更することは、そのような理由もあるので、よほどしっかり練らなければおすすめできません（「入力中の漢字変換が確定させられてしまった」というような事故も発生しえます）。

[退会済みユーザー]

ご回答ありがとうございます。
色々と考えて勉強していきたいと思います。