javascript TEXTAREAの入力制限

とあるWEBアプリを構築していたのですが、TABLE内に配置したTEXTAREAがネックになっていました。
なぜかと言うと、入力の時はTEXTAREAタグ内に文字列が表示されるので、何文字・何行あっても枠のサイズは決まっていたのでレイアウトが崩れることはなかったのですが、それを閲覧モードで表示すると文字数・行数によってはレイアウトが大幅に崩れてしまう。
ウィンドウ内の座標をもとに、レイアウトをしているのでTABLE内のレイアウトが崩れると大変なことになるんです。

そこで、TEXTAREAタグの入力制限を設けようと思い四苦八苦。

やっとのことでできました。

↓クリック応援お願いします。
ランキングはこちらをクリック！

にほんブログ村
人気ブログランキングへ

引数に1行の文字数と行数を設定できるの幅広く使えるよーな気がします。
行数・文字数がオーバーしているとダイアログボックスで警告後、修正してフォーカスを元に戻すという仕様。

とりあえず、問題解決っと。

【サンプル】

<script type="text/javascript"><!--
// TEXTAREA入力制限
function limitChars(target,maxlength,maxrow) {
    Str = target.value;
    //result = Str.match(/^(.|\r\n|\r|\n)$/,"g");
    lines = Str.split("\n").length;
    StrAry = Str.split("\n");
    if( lines > 3 ){
        alert("表示が崩れる為、３行以内で入力して下さい。");
        target.value = Str.replace(/(.|\r\n|\r|\n)$/,"");
    }
    else{
        for(i=0;i<lines;i++){
            if ( StrAry[i].length > maxlength ) {
                alert("表示が崩れる為、２０文字以内で入力して下さい。");
                target.value = target.value.substr(0,maxlength);
            }
        }
    }

    target.focus();
}

</script>
　　　　・
　　　　・
　　　　・
<textarea cols="30" name="comment"　onKeyUp="limitChars(this,10,3)"></textarea>