How to Limit the Number of Characters in a Textarea Field

このQ&Aのポイント
  • Learn how to limit the number of characters in a textarea field in HTML. Discover a workaround for setting a maximum character limit for multi-line text fields.
  • Find out how to use the maxlength attribute in HTML to restrict the number of characters in a single-line text field, and explore the limitations of applying it to multi-line textareas.
  • Looking for a way to limit the number of characters in a multi-line textarea field? Check out this guide to learn about the shortcomings of using the maxlength attribute and discover alternative solutions.
回答を見る
  • ベストアンサー

textareaで入力できる文字数を制限したい。

フォームについて質問させてください。 テキストフィールドで、シングルラインならば入力できる文字の最大数を maxlength で指定できるのですが、マルチラインの場合、同様に最大数を指定することはできないでしょうか? わかるかた、なにとぞご教授ください。 ■シングルラインでの文字数制限 <input name="thread_title" type="text" id="thread_title" size="80" maxlength="10"> ■マルチライン <textarea name="text" cols="64" rows="10" id="news_text" maxlength="10"></textarea> ↑上記のようにmaxlength入れても駄目でした。。。涙

  • HTML
  • 回答数2
  • ありがとう数9

質問者が選んだベストアンサー

  • ベストアンサー
  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.2

スクリプトで制限しないとしょうがないと思います。 参考URLは以前に書いたスクリプトですが参考にして下さい。 制限文字数は、引数で渡してもいいですね。

参考URL:
http://okweb.jp/kotaeru.php3?qid=1059274

その他の回答 (1)

  • shy00
  • ベストアンサー率34% (2081/5977)
回答No.1

http://security.okweb.jp/kotaeru.php3?q=850600 あたりは参考になりませんか?

参考URL:
http://security.okweb.jp/kotaeru.php3?q=850600
dororon999
質問者

お礼

ありがとうございました。 大変参考になりました。

関連するQ&A

  • textareaについて

    textareaに400文字の感想を入力してもらいたいのですが、400文字以上入力することを考え,inputタグと同様にmaxlenght="400"としたいので、400文字以上入力されてしまいます。 <TEXTAREA name="comment" COLS="50" ROWS="5" maxlength="400"></TEXTAREA> textareaではmaxlenghtは効果ないのでしょうか?

    • ベストアンサー
    • HTML
  • テキストエリア文字制限について

    テキストエリア文字制限について 失礼します。 javascript初心者です。 複数のテキストエリアの文字制限を行いたく 苦戦しております。 いろいろと検索してみましたが・・・ 2日ほど悩んでおります。 AとBでエラーが出た場合はCGIに流れず入力フォームに戻るのですが Bでエラーが発生しない場合CGIに流れてしまいます。 ですの文字数制限をしても結局CGIに流れてしまうのですが どのように記述すればよろしいでしょうか?? なんとか・・・ご教授いただければ幸いです。 よろしくお願いいたします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>入力文字数の制限</title> <script language="javascript" type="text/javascript"> <!-- var MAXLENGTH = 10; //入力許容最大文字数 function tareachk(frm){ var tmp = frm.vin1.value; var len = tmp.length; if(len > MAXLENGTH){alert("A入力可能な文字数は"+MAXLENGTH+"文字までです");} var tmp = frm.vin2.value; var len = tmp.length; if(len > MAXLENGTH){alert("B入力可能な文字数は"+MAXLENGTH+"文字までです");} else{frm.submit();} } // --> </script> </head> <body> <form action="ccccc.cgi" method="post"> <textarea name="vin1" rows="5" cols="30">10文字まで入力可能</textarea><br> <textarea name="vin2" rows="5" cols="30">10文字まで入力可能</textarea><br> <input type="button" value="GO" onclick="tareachk(this.form);"> </form> </body> </html>

  • Textareaの入力文字数チェックについて(タグ無視)

    TEXTAREAの文字数チェックまではできるのですが しかし、今回はHTMLのタグも入力されます。 タグを無視した文字数もカウントをやりたいです。 PHPにはそのような関数があったような気がしますが ... JavaScriptではどのようにすれば実現できるのでしょうか? タグの文法エラーはない前提でよいです。 よろしくお願いします。 <html> <head> <title>入力文字数のチェック</title> <script language="JavaScript"> function check() { txt = document.form1.sample.value; n = txt.length; if (n > 100) alert("100文字以内にしてください"); } </script> </head> <body> <form name="form1"> <textarea rows="10" name="sample" onChange="check()" cols="20"></textarea> </form> </body> </html>

  • 入力に関して。

    以下のソースのようにテキストボックスを4つくらい並べて、最大入力文字数になったら、自動的に右のテキストボックスに入力できるようにすることはできるのでしょうか? <html> <head> <title></title> </head> <body> <form name="form1"> <input type="text" name="txt1" size="7" maxlength="3">. <input type="text" name="txt2" size="7" maxlength="3">. <input type="text" name="txt3" size="7" maxlength="3">. <input type="text" name="txt4" size="7" maxlength="3"> </form> </body> </html>

  • textareaの一行の文字数制御

    textareaの一行あたりの文字数を制御、 もしくはカウントすることは可能でしょうか? (textarea全体の文字数ではありません。) cols="100"などと一行の文字数を制御しようとしましたが 横のスクロールバーを表示させると(WRAP="off") どうもうまくいきません。 良い方法をご存知の方がいらっしゃいましたら よろしくお願いします。

    • ベストアンサー
    • HTML
  • textareaで改行させたい

    textareaにあらかじめ文字列を表示させたいと思っています。表示させる文字列は配列に入れていて、配列には aaa bbb ccc のように改行コードが入っているのですが、下記のようにすると、 <textarea name="name1" id="id1" cols="65" rows="15" wrap="soft"><%=Arr(1,6)%></textarea> aaa<br>bbb<br>ccc<br> と表示されます。 テーブルに表示させると問題なく改行されて表示されるのですが、textareaだと、上記のようになってしまいます。 どのようにすればよいかご教示ください。

  • 文字数の制限について

    TextBoxの文字数の制限が上手くいかなくて困っています。 ◆問題点1 最大入力文字数を、半角は50文字、全角は25文字と設定したいです。 下記の質問を参考にし、キーボード入力の制限をかけることが出来ました。 質問:テキストボックスへの文字の入力について http://oshiete1.goo.ne.jp/kotaeru.php3?q=287224 しかし、最大文字数が入力されているときに「貼り付け」を行うと 設定以上の文字数が入力されてしまいます。 入力文字数+貼り付け文字数が、最大入力文字数よりも長ければ、 コピーを禁止したいのですが、何か良い方法はございますか? ◆問題点2 MaxLengthに設定した最大文字数よりも1文字分長く、入力できてしまいます。 MaxLength = 4 と設定したTextBox(仮に「Text1」とします)に半角文字を4文字分入力します。 (このとき、ぴったし4文字分キーボードを押下します。) 次に半角文字2文字分をコピーし、Text1のなかの1文字をドラックして貼り付けます。 (ドラックする文字は最後尾以外です。) 上記手順を行うと、Text1には5文字分入力されてしまいます。 どのような処理を行えば、"4文字まで"と必ず制限できますか? 問題点1、2のどちらか一つでも構いませんので、対処法を教えていただけますか? 宜しくお願いいたします。 なお、環境は Microsoft Windows 2000 Microsoft Visual Basic 6.0 です。

  • フォームの<TEXTAREA>で文字数制限する方法はありますか?

    こんにちは。フォームの<TEXTAREA>で入力文字数を制限をする方法を知りたいのですが、解る方がいらっしゃいましたら教えてください。 MAXLENGTHなどは使用できないようでしたので、Javascriptでの制限方法などがあるのかなと思い書き込みさせていただきました。具体的には全角150文字前後に制限したいと思っております。(※前後全角10文字くらいは誤差があってもかまいません。) サーバーサイドではなくクライアントサイドで動く仕様のものが良いので、こちらに書き込みさせていただきました。よろしくお願い致します。

  • textareaの幅を画面と合わせたい

    HTMLのテキストエリアで画面サイズに合わせたいのですが、 何か方法はないでしょうか。 お知恵を貸してください。 <textarea name="addtext" cols="35" rows="25"></textarea> これだと固定になってしまいます。 <textarea name="text" width=30% height=100%></textarea> イメージ的にはこんなことをしたいのです。

    • ベストアンサー
    • HTML
  • textとtextareaの書式に設定について

    先日、質問をさせて頂きました者になります。 input textとtextareaの書式の設定制御の方法が、 分からなくなってしまい質問をさせて頂きました。 【やりたい事】 textやtextareaの初期値のテキスト色とバックグランの色を、 textやtextareaに初期値が入っている時と入力した値が入っている時に、 指定した書式に各種設定したいと思っています。 具体的には、textやtextareaに初期値が入っている時には、 初期値の文字を薄いグレー色に設定し、バックグランドをピンク色に設定し、 textやtextareaに入力をした値が入っている時には、 入力した文字を黒色に設定し、バックグランドを白色に設定したいと思ってます。 ご教授頂ければと存じます。 よろしくお願いいたします。 【ソース】 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN Frameset" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <script type="text/javascript"> <!--ログ生成スクリプトを取得--> function textoutput(formObj) { <!--text01を取得--> if((text01 = formObj.elements["text01"].value)==formObj.elements["text01"].defaultValue)text01=""; <!--text02を取得--> if((text02 = formObj.elements["text02"].value)==formObj.elements["text02"].defaultValue)text02=""; <!--textarea01を取得--> if((textarea01 = formObj.elements["textarea01"].value)==formObj.elements["textarea01"].defaultValue)textarea01=""; <!--textarea02を取得--> if((textarea02 = formObj.elements["textarea02"].value)==formObj.elements["textarea02"].defaultValue)textarea02=""; <!--出力データを作成--> var text = ''; <!--text3データを作成--> if(text01!==""){ text += '質問1:' + '\n'+ text01 + '\n'; } <!--text2データを作成--> if(text02!==""){ text += '質問2:' + '\n'+ text02 + '\n'; } <!--textarea01データを作成--> if(textarea01!==""){ text += '質問3:' + '\n'+ textarea01 + '\n'; } <!--textarea02データを作成--> if(textarea02!==""){ text += '質問4:' + '\n'+ textarea02 + '\n'; } <!--出力データを作成--> formObj.elements["output"].value=text; } </script> </head> <body> <form name="form01"> <strong>・諮問1:</strong><br> <input type="text" name="text01" value="1入力してください" id="p1" size="30" class="disabled" onfocus="if (this.value == defaultValue) this.value = '';" onblur="if (!this.value) this.value = defaultValue;"><br> <strong>・諮問2:</strong><br> <input type="text" name="text02" value="2入力してください" id="p2" size="30" class="disabled" onfocus="if (this.value == defaultValue) this.value = '';" onblur="if (!this.value) this.value = defaultValue;"><br> <strong>・諮問3:</strong><br> <textarea name="textarea01" id="textarea01" cols="60" rows="5" onfocus="if(this.value == this.defaultValue) this.value=''" onblur="if(this.value == '') this.value=this.defaultValue"> 3入力してください </textarea><br> <strong>・諮問4:</strong><br> <textarea name="textarea02" id="textarea02" cols="60" rows="5" onfocus="if(this.value == this.defaultValue) this.value=''" onblur="if(this.value == '') this.value=this.defaultValue"> 4入力してください </textarea><br> <strong>・出力結果:</strong><br> <input type="button" value="ログ出力" onClick="textoutput(this.form);">&nbsp;<br> <textarea cols=60 rows=20 name="output" id="output"></textarea><br> <textarea id="text" cols="30" rows="5" wrap="soft"></textarea><br> <button onclick="save();">save</button><a id="anchor" href=""></a> </form> </body> </html>

専門家に質問してみよう