您的位置:首页 > Web前端 > JavaScript

javascript实现文本框默认内容Demo

2011-07-12 22:55 351 查看


<html>
<head>
<title>javascript实现文本框默认内容Demo</title>
<script type="text/javascript">
window.onload=function(){
document.getElementById("txtSearch").onfocus=function(){
if(this.value="DefaultKey"){
this.value='';
}
};

document.getElementById("txtSearch").onblur=function(){
if(!this.value){
this.value='DefaultKey';
}
};
}

//显示搜索的关键词
function showSearch(){
var keyword=document.getElementById("txtSearch").value;
var result=document.getElementById("txtResult");
result.firstChild.nodeValue=keyword;
}
</script>
<style type="text/css">
p{
display:inline;
}

.default{
color:#ccc;
}
</style>
</head>
<body>
<input type="text" id="txtSearch" value="DefaultKey" class="default"/>
<input type="button" id="btnSearch" value="Search" onclick="showSearch()">
<p>SerachedKeyword:</p><p id="txtResult">Result</p>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: