自動刪除輸入值

例如，我有一個文本輸入以「在這裏插入文本」像這樣一個值：自動刪除輸入值

<input type="text" value="insert text here" />

當我點擊輸入的塊，然後的「文本「在這裏插入文字」會自動消失，但是當用戶取消在那裏寫東西時，文字會再次出現。

如何做到這一點？

感謝

來源

2014-10-20 Al Kush

您可以使用HTML佔位符。 [更多]（http://www.w3schools.com/tags/att_input_placeholder.asp） – Ruddy 2014-10-20 07:37:30

佔位符很棒！謝謝！解決了！ – 2014-10-20 07:41:16

如果以下答案對您有幫助，您應該標出解決方案。標記任何適合你的人 – BNN 2014-10-20 07:45:14

使用佔位符屬性
<input name="" type="text" placeholder="place holder text here."/>

但它可能不適用於較舊的瀏覽器。如果您使用的是較舊的瀏覽器，則應該使用javascrip/jquery來處理此問題。

<input type="text" class="userName" value="Type User Name..." /> 


$(document).ready(function(){ 

    $('.userName').on('focus',function(){ 
    var placeHolder = $(this).val(); 
     if(placeHolder == "Type User Name..."){ 
      $(this).val(""); 
     } 
    }); 
    $('.userName').on('blur',function(){ 
    var placeHolder = $(this).val(); 
     if(placeHolder == ""){ 
      $(this).val("Type User Name..."); 
     } 
    }); 

});

看到德莫JSFIDDLE

來源

2014-10-20 07:55:08

使用該placeholder屬性

<input type="text" placeholder="insert text here" />

來源

2014-10-20 07:38:27

<input type="text" name="fname" placeholder="insert text here">

來源

2014-10-20 07:38:29 Wizard

你需要使用「佔位符」屬性，像這樣：

<input type="text" placeholder="insert text here" />

佔位符文本將被自動刪除時在該領域打字的東西

http://www.w3schools.com/tags/att_input_placeholder.asp

來源

2014-10-20 07:38:41

使用佔位符而不是值。

<input type="text" placeholder="insert text here" />

來源

2014-10-20 07:38:47 Dale

你可以做到這一點使用Placehoder 但你需要知道舊版本的瀏覽器，因爲它不支持的地方HODER

<input type="text" value="some text" placeholder="insert text here"/>

對舊版本的瀏覽器u可以使用的下面的鏈接並下載JS

link

來源

2014-10-20 07:39:05 BNN

-1

If you want compatible in all browsers then you can use this code. 
<!DOCTYPE html> 
<html> 
<body> 

First Name: <input type="text" id="myText" placeholder="Name"> 

<p>Click the button to display the placeholder text of the text field.</p> 

<button onclick="myFunction()">Try it</button> 

<p id="demo"></p> 

<script> 
function myFunction() { 
    var x = document.getElementById("myText").placeholder; 
    document.getElementById("demo").innerHTML = x; 
} 
</script> 

</body> 
</html>

來源

2014-10-20 07:46:06 Websolutionexpert24

它只是w3schools的複製粘貼，你應該解釋它。它也可以在沒有javascript的情況下實現 – BNN 2014-10-20 07:47:14

是的，我知道它只是複製粘貼，但它是問題的解決方案。 – Websolutionexpert24 2014-10-20 07:48:29

@Nadeem你也給解決方案作爲複製粘貼，你也可以檢查你的代碼 – Websolutionexpert24 2014-10-20 07:50:33

自動刪除輸入值

回答

相關問題