jqueryを使用してテキストボックスをクリックしたときにヘルパーテキストを表示

Question

テキストボックスをクリックしてヘルパーテキストを表示します。 例えば：私は、テキストボックスをクリックした場合、それは型に何を言って私たちを助ける必要があります。ここにユーザー名を入力します

私は与えられたコードの下にしようとしているが、テキスト「ユーザ名を入力してください」がフェードアウトされ、私が欲しいですフォーカスが別のテキストボックスに変更されるまで表示されるテキスト。

どうかこのタイプのコードをご提案ください。

<input type = "text"/><span>Enter username</span> 
<input type = "text"/><span>Enter password</span>  


$(document).ready(function(){ 
    $("input").focus(function() { 
     $(this).next("span").css('display','inline').fadeOut(1000); 
    }); 
}); 

Answer 1

次のようなものは、ここでそれを

$(function(){ 
    $("input") 
     .focus(function() { 
      $(this).next("span").fadeIn(1000); 
     }) 
     .blur(function() { 
      $(this).next("span").fadeOut(1000); 
     }); 
}); 

を行う必要があり、私はなぜあなたはCSSのdisplayプロパティを操作するだけでなく、フェードインを使用しているかわからないWorking Demo

Answer 2

です/ fadeOut：

$(document).ready(function(){ 
    $("input").focus(function() { 
     $(this).next("span").fadeIn(1000); 
    }).blur(function() { 
     $(this).next("span").fadeOut(1000); 
    }); 
});