-3

パスワードフィールドに「パスワードを入力してください」などのデフォルトのテキストを表示する必要があります。IE7をサポートする必要があるため、ここではプレースホルダー属性は解決策ではありません。onfocusとblurを使用しましたが、InternetExplorerでは機能しません。

<input type="text" value="Enter the password" id="fieldPassword" onfocus="showPass()" onblur="hidePass()"/>

function showPass()
{
    var pass = document.getElementById('fieldPassword').value;
    if((pass=="Enter the password")||pass=="")
    {
        document.getElementById('fieldPassword').type="password";
        document.getElementById('fieldPassword').value="";   
    }
    else
    {
    }
}

function hidePass()
{
    var pass = document.getElementById('fieldPassword').value;
    if(pass=="")
    {
        document.getElementById('fieldPassword').type="text";
        document.getElementById('fieldPassword').value="Enter the password";
    }
}
4

3 に答える 3

4

これを達成するには、を使用する必要があります

<input type='text' value='Enter your password' />

クリック/フォーカスすると、入力要素のタイプが次のように変更されます。

<input type='password' />

ぼかし時に値に変更がない場合は、テキストタイプに戻します。表示/非表示にする2つの異なる入力を使用してこれを実現することもできますが、その場合、新しく表示される要素にフォーカスをトリガーする必要があり、両方に同じIDを使用することはできません。

于 2012-09-02T15:45:00.513 に答える
0

http://jsfiddle.net/9GTcL/2/を参照してください

HTML：

<div class="placeholder">
    <input type="password" id="pswdInput" />
    <input type="text" value="Enter password..." id="textInput" />
</div>

JavaScript：

var text=document.getElementById('textInput'),
    pswd=document.getElementById('pswdInput');
text.onfocus=pswd.onfocus=function(){
    text.style.display='none';
    pswd.focus();
}
pswd.onblur=function(){
    if(pswd.value==''){
        text.style.display='block';
    }
}

CSS：

.placeholder{
    position:relative;
}
.placeholder>#textInput{
    position:absolute;
    top:0;
    left:0;
}
.placeholder>input{
    width:140px;
}
于 2012-09-02T18:10:59.317 に答える
-1

これは、IEのプレースホルダーに使用するjsファイルです。これをダウンロードしてページのヘッダーにリンクし、最後のbodyタグの直前にこのコードを追加します。

<script type="text/javascript">$('input[placeholder], textarea[placeholder]').placeholder();</script>
于 2012-09-02T16:28:11.890 に答える