No.2ベストアンサー
- 回答日時:
Webコンテンツを作成しています。
ユーザの入力をJavaScriptによって細かくチェックしたいという気持ちは分かりますが、あんまりしつこくやるとユーザに嫌われます。
各入力フィールドごとに制限事項を小さい字で補足しておき、送信ボタン押下時のみチェックしてalertする程度が1番いいようです。
もう少しやるにしても、onBlurのみのチェックにしておいた方がいいですよ。
JavaScriptの練習がしたいというのであれば、387さんの回答を試してみるとよいと思います。
No.1
- 回答日時:
以下のようにすると良いのではないでしょうか?
※ 動作確認しやすいように 5文字でチェックしています。
ポイントは、テキストエリアに入力する手段として、キー入力と「貼り付け」の
2種類がある事です。
それと、キー入力時には事前にチェックができますが、「貼り付け」時には
テキストエリアがフォーカスを失う(別の要素に移動する)時しかチェック
できない為、データが既に文字数制限をオーバーしている可能性がある点です。
その為、最後に文字数制限内だったデータを保持する処理と制限オーバーした
時に保持しているデータに復元する処理を行っています。
※ データの一部を書き換える(文字列を選択してからキー入力 or「貼り付け」)
場合の処理も必要ですが、今回は割愛しています。
●スクリプト
var strTextarea = "" ; // テキストエリアデータの保存用
function funcCheckOnChange( oTextarea )
{
if ( oTextarea.value.length > 5 )
{
alert( "文字数は 5文字迄です。" ) ;
oTextarea.value = strTextarea ; // データを復元
}
else
{
strTextarea = oTextarea.value ; // データを保存
}
}
function funcCheckOnKeypress( oTextarea )
{
if ( oTextarea.value.length >= 5 )
{
alert( "文字数は 5文字迄です。" ) ;
if ( oTextarea.value.length > 5 )
{
oTextarea.value = strTextarea ; // データを復元
}
event.returnValue = false ; // キー入力をキャンセル
}
}
●テキストエリア
<TEXTAREA
onKeypress="funcCheckOnKeypress( this ); strTextarea = this.value"
onChange="funcCheckOnChange( this )">
</TEXTAREA>
※ IEでのみ動作確認しています。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・「I love you」 をかっこよく翻訳してみてください
- ・歩いた自慢大会
- ・許せない心理テスト
- ・字面がカッコいい英単語
- ・昔のあなたへのアドバイス
- ・かっこよく答えてください!!
- ・あなたが好きな本屋さんを教えてください
- ・これ何て呼びますか Part2
- ・人生で一番思い出に残ってる靴
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・初めて自分の家と他人の家が違う、と意識した時
- ・単二電池
- ・チョコミントアイス
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
JSPとJavaScriptの連携について...
-
テキストエリアに入力可能な文...
-
onClickとsubmitの処理順序
-
submit後、同じ入力欄に戻らせ...
-
「見出し語」だけを検索するス...
-
VBScript
-
セレクトボックスの操作につい...
-
テキストボックスを無効にする...
-
プルダウン 項目が多いので先頭...
-
VBSでブラウザ上のテキストボッ...
-
JQuery Mobileでチェックボック...
-
ラジオボタンの選択で解答・点...
-
ブラウザの戻るボタンを押した...
-
【jQuery】input nameの文字列...
-
JavaScriptde途中で、「exit」...
-
return trueとreturn falseの用...
-
確認ページからフォームページ...
-
動的にTabindexの値を変えたい!
-
tableの任意行にfocusをあてる
-
FormのonsubmitでJavaスクリプ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
onClickとsubmitの処理順序
-
文末の改行コードを削除したい
-
JSPとJavaScriptの連携について...
-
JQueryで2つのテキストフィー...
-
フォームの値が0だったら空白...
-
フィールドを有効(enabled?)に...
-
ASP エラーチェック VBScript
-
PDFフォームで条件つき金額を表...
-
テキストボックスのグレーアウト
-
Javascript 郵便番号の入力欄で...
-
テキストボックス入力を半角英...
-
フォームから入力すると、入力...
-
submit後、同じ入力欄に戻らせ...
-
条件により、リンク先に画面遷...
-
最初の入力を判断
-
2重でメール入力チェックをした...
-
テキスト入力フォームの値を画...
-
HTMLで入力したものを変数で扱...
-
javascriptで入力フォームが空...
-
Javascriptが機能せず原因が分...
おすすめ情報