JavaScriptでフォームの文字数をチェックして送信
- 2010
- 4月
- 01日
JavaScriptでフォームの textare の入力文字数をチェックして、
文字数に応じてアラートか submit を返します。
HTML
<form action="#" name="form"> <textarea cols="30" rows="10" id="message";></textarea> <input type="button" value="送信" onClick="set_limit()"> </form>
JavaScript
var txt_limit = 50;//最大文字数
function set_limit(that){
var check_element = document.getElementById("message");
var check_limit = check_element.value.length;
if(check_limit > txt_limit){
alert('入力文字数が '+txt_limit+'文字を越えました');
check_element.focus();
}
document.form.submit();
}
また、textarea に入力した文字数もリアルタイムに反映されるようにしました。
textarea に onkeyup を追加。
<textarea cols="30" rows="10" id="message" onkeyup="ShowLength(value);"></textarea>
文字数を反映するID要素を追加。
<p id="textlength">0文字</p>
以下のJavaScriptを追加。
function ShowLength( str ) {
document.getElementById("textlength").innerHTML = str.length + "文字";
}
