ユーザーがパスワードを入力する前にパスワードフィールドを入力して（フィールドが何であるかを知るように）パスワード入力の既定値を読み取り可能に設定する
I ' dではむしろJavascriptを使用していますが、jQueryをインポートするだけで無駄に見えますが、どうすればよいか分かりません。画像は非常に明確に説明します。
それがどのように見える：それは非常に簡単です
：私はそれが見えるようにしたい
ウェブサイトと最も基本的なログイン（確認などはありません）
アイデア？
<input id="username" name="username" class="input_text" type="text" value="Username" />
<input id="password" name="password" class="input_text" type="password" value="Password" />
textであるためにあなたの
password入力を変更し
。次に、フォーカスイベントのJavaScript（またはJQuery）を入力タイプpasswordに変更します。
<html>
<head>
<script type="text/javascript">
function makeItPassword()
{
document.getElementById("passcontainer")
.innerHTML = "<input id=\"password\" name=\"password\" type=\"password\"/>";
document.getElementById("password").focus();
}
</script>
</head>
<body>
<form>
<span id="passcontainer">
<input onfocus="return makeItPassword()" name="password" type="text" value="Type Password" />
</span>
</form>
</body>
</html>
+1。それが私のやり方です。 .attr（ "type"、 "password"）;}）; '$（"＃password "）; $（"＃password " –
'input'要素の' type'要素を変更することは、IEでは正しく動作しません。参照：http://stackoverflow.com/questions/1544317/ – CMS
@CMS：素晴らしい点。それを知らなかった！ –
シンプルなソリューション：
<input id="username" name="username" class="input_text" type="text" placeholder="Username" />
<input id="password" name="password" class="input_text" type="password" placeholder="Password" />
あなたはHTML5を使用している場合、あなたはplaceholder attributeを使用する必要があります。ここ
は無地のJavaScript（無jQueryの）と少しテストしていないサンプルです。
<input id="username" name="username" class="input_text" type="text" placeholder="Username" />
<input id="password" name="password" class="input_text" type="password" placeholder="Password" />
あなたはHTML4を使用している場合は、fake password fieldを作成することができます。
<script type="text/javascript">
function pwdFocus() {
$('#fakepassword').hide();
$('#password').show();
$('#password').focus();
}
function pwdBlur() {
if ($('#password').attr('value') == '') {
$('#password').hide();
$('#fakepassword').show();
}
}
</script>
<input id="username" name="username" class="input_text" type="text" v="Username" />
<input id="fakepassword" name="fakepassword" type="text" value="Password" style="color:#ccc" onfocus="pwdFocus()" />
<input id="password" name="password" class="input_text" type="password" style="display:none" onblur="pwdBlur()" />
私はこの問題に対処するための別の考えを持っていた、あなたは何のJavascriptを必要としません：
<input onclick="value=''; type='password';" name="password" type="text" value="Password" />
それともまた、このようにそれを行うことができます。
<input onclick="this.value=''; this.type='password';" name="password" type="text" value="Password" />
私にはわかりませんこの可能性の違い。あなたが変更される可能性が もう一つはonclick=.......onfocus=.....
の代わりに書くことである私も、ここでの違いを知りません。
しかし、私はあなたを助けてくれることを願っています。 PS：私の悪い英語のためにすみません、私はドイツ人です。
"あなたはJavascriptが必要ありません" - これはJavaScriptです。 – MrWhite
あなたのJavaScriptに次のコードを追加します。
function makePasswordHidden() {
document.getElementById("password").setAttribute("type", "password");
}
変更にパスワードの入力：
これは、それがinput要素「パスワード」と値を作るん何<input id="password" name="password" class="input_text" type="text" value="Password" onfocus="makePasswordHidden();">
をそれが隠されるように更新されます。
function makePasswordShown() {
document.getElementById("password").setAttrivute("type", "text");
}
そして、あなたのパスワード入力に以下を追加します：あなたは、フィールドが空のままの場合=「パスワード」値が表示されるようにするために希望の場合は、次のJavaScript関数を追加
onblur="if (this.value=='') makePasswordShown(); if (this.value=='') this.value='Password';"
ますフィールドのタイプを動的に変更することでハックすることができます（つまり、最初の "text"、起動時に "password"に変更してください）。私はこれが動作することを100％保証しているわけではありません。 –