WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:テキストエリアで行数制限

0:[投稿] なつ [MAIL] [2003/01/28 22:29 ][環境:IE6 わからない]

フォーム画面のテキストエリアで行数制限をしたいのです。送信前にあるボタンを押すと、テキストエリア内の行数をチェックして、メッセージを別ウィンドウか何かで出すようにしたいのですが、どのようにしたらよいのでしょうか?CGIでもJavascriptでもなんでもよいのですが・・・。
教えてください。よろしくお願いします!m(_ _)m


1:[回答] Malic [2003/01/29 09:10 ]

改行コードの数調べるとかかな?


2:[質問] なつ [MAIL] [2003/01/29 12:13 ]

Malicさん、早速の回答ありがとうございます。今、テキストエリアはwrap="soft"で見た目だけ改行されるようになっているのですが、その見た目の行数をチェックしたいのですが・・・。どのようにすれば・・?


3:[関連] ごだっち [MAIL] [2003/01/29 13:14 ]

この手のチェックの場合、文字数制限(200文字以内など)が思い当たるのですが、なつさんのご要望は「文字数」では無く「行数」なのですよね?

で、行数であれば、Malicさんの言われる改行コードの数を調べるというのが一つと、あとは、改行コードから次の改行コードまでの文字数を調べて、ある一定も文字数以上であれば改行されたものと見なす、という方法が思いつきます。

ただ、入力された内容が英文などの場合、単語区切りのword-wrapが行われてしまうため、単純に文字数だけで改行と見なすことも出来ませんねぇ...、う〜む。どうしたものか。
(すみません、何の回答にもなっていませんね。)


4:[回答] Malic [2003/01/29 13:35 ]

soft だと分かりません・・。

半角文字限定なら、cols属性の値を信用して、
文字数から行数を計算することもできるけど、(もちろん入力中に改行があった場合の考慮も必要)
2バイト文字入るとcols属性値信用できないし。
(IE6.0で、cols=30で、2バイト文字16字書けたり・・)


5:[回答] ごだっち [MAIL] [2003/01/29 13:43 ]

ん〜っと、こちらのMSDNのページに紹介されていたサンプル(下のほう)が参考になりそう。
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/methods/getclientrects.asp

んで、これをベースに加工したのが、コレ。
http://homepage2.nifty.com/godakaz/laboratory/030129/2.html

まったりと移動するカーソルが、一文字ずつ追いかけて、行数をカウントしてくれます(笑)。


6:[回答] Malic [2003/01/29 13:45 ]

>3 単語区切りのword-wrapが行われてしまうため 
これは半角スペースが(文の途中に)入るでしょうから、それで判定するしかないですね。
ちなみに半角スペースは電文(送信データ)上は + になります。
(テキストエリア上の + は  %2B です)


7:[回答] ごだっち [MAIL] [2003/01/29 14:36 ]

先のサンプルのキモだけ取り出したのが、コレ。

<html>
<head>
<script>
<!--
var nLine;
var oRcts;
function count_start() {
    oTextRange = document.all('target').createTextRange();
    oRcts = oTextRange.getClientRects();
    nLine = oRcts.length;
    alert(nLine);
}
//-->
</script>
</head>
<body>
<form>
<textarea id="target" rows="16" cols="30"></textarea>
<input type="button" onClick="count_start();" value="count">
</form>
</body>
</html>


8:[完了] なつ [MAIL] [2003/02/02 21:27 ]

ものすごく助かりました!本当にありがとうございました。m(_ _)m
またなにかありましたらよろしくお願いします。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World