回答編集履歴

1 文章追加

kszk311

kszk311 score 3309

2018/05/16 12:32  投稿

こういったところでしょうか。
エラー文のクラスをつけて、一つ前にそのクラスがあるかどうかで判定すれば、何個も出なくなります。
OKの時に、エラー文があれば削除する処理もつけておきました。
```js
   $("input[name='zenkaku']").focusout(function(){
       // 文字チェック 正規表現
       if(!$(this).val().match(/^[^\x01-\x7E\xA1-\xDF]+$/)){
           // エラー表示
           if($(this).prev('.error').length == 0){
               $(this).before('<p class="error">※全角文字のみです</p>');
           }
       }else{
       //OK
           if($(this).prev('.error').length > 0){
           //エラー文があれば削除
               $(this).prev('.error').remove();
           }
       }
   });
```
自分は、入力したらすぐ間違っているか分かるので、その都度チェックされていた方が好みです。  
 
cssは分離しておいた方が良いです。
```css
   .error {
       color: red;
   }
```

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る