デフォルト値が「パスワード」を示し、フォーカスを当てるとフォームフィールドのヒントを作成したい場合、それはなくなります。フィールドが使用入力なしでフォーカスを失った場合、デフォルト値「パスワード」に戻ります。パスワードフィールドのパスワードマスキングを無効にする
問題:パスワードフィールドのデフォルト値も同様にマスクされます。 「パスワード」のデフォルト値をマスクすることなく表示するにはどうしたらよいですか?それを行うには
jQueryのコード
$(".splash_register_short_input, .splash_register_long_input").each(function() {
$(this).val($(this).attr('title'));
});
$(".splash_register_short_input, .splash_register_long_input").focus(function() {
if($(this).val() == $(this).attr('title')) {
$(this).val('');
}
});
$(".splash_register_short_input, .splash_register_long_input").blur(function() {
if($(this).val() == '') { // If there is no user input
$(this).val($(this).attr('title'));
$(this).removeClass('splash_register_have_userinput');
} else { // If there is user input
$(this).addClass('splash_register_have_userinput');
}
});
HTMLコード
<form id="splash_register_traditional_form">
<input type="text" name="register_first_name" class="splash_register_short_input" title="First Name" /><label for="register_first_name"></label>
<input type="text" name="register_last_name" class="splash_register_short_input" title="Last Name" /><label for="register_last_name"></label>
<input type="text" name="register_email" class="splash_register_long_input" title="Email" /><label for="register_email"></label>
<input type="password" name="register_password" class="splash_register_long_input" title="Password" /><label for="register_password"></label>
<input type="submit" id="splash_register_signup_button" value="Sign up" />
</form>
+1 - 完全に忘れました。よくやった。 – mrtsherman
標準、シンプルなソリューションのためのUpvote。しかし、これは下位互換性が全くないため、あまり堅牢ではありません。 – rockerest
さて、私はIE10が*最終的にはこの最も素晴らしい属性をサポートすることになっていると思います。他にも誰もがすでにそれを持っています。 –