0

簡単な検証を行う必要があります。最初は問題なく動作しますが、テキストに値を入力した後、F5 キーを押してページを更新すると、コードが正しく動作しません。

バグを生成する手順

  1. 最初のテキスト ボックスに注目し、値を入力せずにぼかします。関数は「エラー」を警告し、エラーという名前のクラスがテキストボックスに追加されます

  2. テキストボックスに値を入力してF5を押します。次に、テキストボックスから値を削除すると、ぼかし機能が「エラーなし」と警告し、ここで問題が発生します。空のテキスト ボックスがぼやけているため、アラートが表示されるはずです。

私はゲートを投資し、入力テキスト値が空白と等しくない場合にコードに言及し、テキストボックスをぼかすonload関数が原因でこの問題が発生していることを発見しました

<head>
  <script type="text/javascript" src="jquery-1.8.3.js"></script>
  <script type="text/javascript">
    $(function(){
       $('input').blur(function(){
          if($(this).hasClass('error')){
             alert('error')
          }
          else {
             alert('no error')
         }
     }) 
  })

  function test(id){
     if($(id).val()==''){
       $(id).addClass('error')
     }
     else {
       $(id).removeClass('error')
     }
  }

  $(function(){
     setTimeout(function(){
          $('input').each(function(){
             if($(this).val()!=''){
                $(this).blur();
             }
          })
     },1000)
  })
</script>
<style>
    .error{ border:#F00 solid 1px}
</style>
</head>


<body>
    <input type="text" onblur="test(this)"/>
    <input type="text" onblur="test(this)" />
</body>
4

2 に答える 2

0

以下を試してみてください:

スクリプト部分:

  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <script type="text/javascript">
  function test(textId){    
     if($("#"+textId).val()==""){
       $("#"+textId).addClass("error"); 
       alert("Error"); 
       setTimeout(function(){
       $("#"+textId).focus();
       },100);
       return false;
     }
     else {
       $("#"+textId).removeClass("error");
       alert("No Error");
       return true;
     }
  }
  </script>

HTML 部分 :

<style>
    .error{ border:#F00 solid 1px}
</style>
<body>
    <input type="text" onblur="test(this.id);" id="text1" value=""/>
    <input type="text" onblur="test(this.id);" id="text2" value=""/>
</body>

これはあなたの問題を解決するのに役立つかもしれないと思います.

于 2013-03-26T09:47:51.720 に答える
0

cssクラスではなく、入力ボックスが空かどうかを判断する際に値を確認した方がよいでしょう。

$('input').blur(function () {
    if ($.trim($(this).val()) == '') {
        alert('error')
    } else {
        alert('no error')
    }
});

FF は HTML ドキュメントの状態を保持しようとするため、クラスは要素に適用されたままになると思います

于 2013-03-26T08:47:24.233 に答える