2011-12-08 10 views
2

テキストボックスに値を入力するたびに、ラベルのテキストを緑色にすることを試みています。そうでない場合、ラベルのテキストの色は青色になります。JQueryを使用しない単純な検証が有効でない

テキストボックスに値を入力すると、ラベルの色が緑色に変わります。ただし、テキストを削除すると、ラベルは緑色のままで、青色に変わらない。

私のHTMLコードは次のとおりです。

<html><body><form> 
    <input type="text" id="name" name="name" placeholder="First Name" /> 
    <label for="name">First Name </label> 
</form></body></html> 

私のスクリプトは次のとおりです。あなたが$('input[type=text])ない$('input[type="text"]')に肝炎

<script type="text/javascript" src="jquery-1.5.2.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('input[type="text"]').focusin(function() { 
      var sd=$(this).attr('id'); 
      var val=$(this).val(); 
      $('label[for^="'+sd+'"]').css('display','inline'); 
     }); 

     $('input[type="text"]').focusout(function() { 
      var val=$(this).val(); 
      var sd=$(this).attr('id');    
      if(val===''){ 
       $('label[for^="'+sd+'"]').css('display','none'); 
      } else { 
       $('label[for^="'+sd+'"]').css({ 
        'display':'inline', 
        'color':'#82A714' 
       }); 
      }  
     }); 
    }); 
</script> 

答えて

1

、ここで私は値を入力した後、あなたJS Fiddle

+0

のための作業コードでありますテキストの色が緑色に変わる時間は –

+0

です。私の問題は、テキストボックスの値を削除した後です。テキストボックスに何を入力したか私はあなたの問題を解決しました –

+0

は[JSフィドル](http://jsfiddle.net/8PJmG/11/)をチェックします。これを修正する別の方法を見つける:) –

関連する問題