單擊文本時刪除文本框的默認數據

如您所知，我想刪除文本框的默認值，同時單擊該文本框，此代碼有效。但是，當我點擊框，然後再次點擊屏幕的另一部分（我的意思是出文本框）數據不會回來。我該怎麼辦？單擊文本時刪除文本框的默認數據

<html><head><title>(Type a title for your page here)</title> 

    <script type="text/javascript"> 
    function make_blank() 
    { 
    document.form1.type.value =""; 
    } 
    </script> 

    </head> 
    <body > 

    <form name=form1 method=post action='test.php'> 
    <input type=text name=type value='Enter your user id' onclick="make_blank();">Enter User ID 
    <b>Type</b> 
    <input type=submit value=Submit> </form> 

    </body> 
    </html>

來源

2012-09-04 Mehdi Raash

這不是一個默認值。這是一個標籤。它應該在''元素中，而不是值屬性。不要通過濫用值屬性來創建輔助功能問題。 – Quentin

根據您使用的是HTML5還是XHTML（或HTML4），您的問題的解決方案是以下之一。既然你沒有說明你正在使用哪一個，我會添加兩個。

順便說一句，你真的想使用焦點事件，而不是點擊事件。這是因爲用戶也可以使用他/她的鍵盤或其他訪問鍵導航到表單字段。

正如Quentin正確states,the specification明確了佔位符文本應該用於什麼。因此，我已將您正在使用的文本更新爲更適合的內容。

HTML5

<input type="text" name="type" placeholder="[email protected]">

XHTML

HTML：

<input type="text" name="type" value="[email protected]" 
    onfocus="make_blank(this);" onblur="restore_placeholder(this);" />

的Javascript：

function make_blank (oInput) 
{ 
    if (!('placeholder' in oInput)) 
     oInput.placeholder = oInput.value; 
    if (oInput.value != oInput.placeholder) 
     oInput.value = ''; 
} 

function restore_placeholder (oInput) 
{ 
    if (oInput.value == '' && 'placeholder' in oInput) 
     oInput.value = oInput.placeHolder; 
}

來源

2012-09-04 12:45:57 jaffog

請注意[規範]（http://www.w3.org/TR/html5/common-input-element-attributes.html#the-placeholder-attribute）。 *佔位符屬性代表旨在幫助用戶輸入數據的簡短提示（單詞或短語）。提示可以是樣本值或預期格式的簡要說明。*和*佔位符屬性不應用作標籤的替代品。* – Quentin

@Quentin True。我更新了這個例子。也修復了一下。 – jaffog

以下HTML5和JavaScript（對HTML4）的組合，對我的作品好看：

HTML：

<input type="text" name="type" placeholder="[email protected]" 
     onfocus="make_blank(this);" 
     onblur="restore_placeholder(this);" />

的Javascript：

function make_blank(oInput) { 
    if (oInput.value == 'placeholder') { 
     oInput.value = ''; 
    } 
} 

function restore_placeholder(oInput) { 
    if (oInput.value == '') { 
     oInput.value = 'placeholder'; 
    } 
}

來源

2014-03-01 10:44:57

單擊文本時刪除文本框的默認數據

回答

相關問題