質問: JavaScriptでウィンドウがフォーカスアウトされた時に入力チェックを行いエラーが表示されるようにしてみたのですが、これでは画面遷移をするまでエラーが出続けてしまい、悪戦苦闘しております。 ``` $(document).ready(function() { // 全角文字 $("input[name='zenkaku']").focusout(function(){ // 文字チェック 正規表現 if(!$(this).val().match(/^[^\x01-\x7E\xA1-\xDF]+$/)){ // エラー表示 $(this).before('※全角文字のみです'); // 赤文字 $(this).prev().css('color','red'); } }); ``` ``` 全角文字 ``` 色々と調べたのですが、そもそもフォーカスアウトした後に再度同じチェックをすることが可能なのかどうかすらわからない状態です。 どなたか、ご存知な方いらっしゃいましたら教えていただけると助かります。
回答: こういったところでしょうか。 エラー文のクラスをつけて、一つ前にそのクラスがあるかどうかで判定すれば、何個も出なくなります。 OKの時に、エラー文があれば削除する処理もつけておきました。 ``` $("input[name='zenkaku']").focusout(function(){ // 文字チェック 正規表現 if(!$(this).val().match(/^[^\x01-\x7E\xA1-\xDF]+$/)){ // エラー表示 if($(this).prev('.error').length == 0){ $(this).before('※全角文字のみです'); } }else{ //OK if($(this).prev('.error').length > 0){ //エラー文があれば削除 $(this).prev('.error').remove(); } } }); ``` 自分は、入力したらすぐ間違っているか分かるので、その都度チェックされていた方が好みです。 cssは分離しておいた方が良いです。 ``` .error { color: red; } ```