如何實現點選文字框清除其中文字

admin發表於2017-02-18

此種效果經常用在搜尋框中，預設狀態下搜尋框中有提示語言，當點選搜尋框時會清除其中的文字，下面就來簡單介紹一下如何實現此種效果。儘管此效果沒有用到CSS程式碼，因為程式碼比較常用，所以在這裡也介紹一下。

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script type="text/javascript">
window.onload=function(){
  var txt=document.getElementById("txt");
  txt.onclick=function(){this.value=''}
  txt.onblur=function(){this.value='請輸入搜尋內容！'}
}
</script>
</head> 
<body> 
<input type="text" name="mytest" id="txt" value="請輸入搜尋內容!" />
</body> 
</html>

相關文章