html中input文本框,初始里边有文字提示。当点击时,文字消失,怎么改?
发布网友
发布时间：2022-04-23 09:10
共1个回答
热心网友
时间：2022-04-19 07:25
使用onfocus事件检查当前值,如果是默认值,就将value属性置空.如:
<input type="text" value="请输入内容" onfocus="javascript:if(this.value=='请输入内容')this.value='';">
单纯的文本框：（通常用用户名之类的）
<input type="text" name="username" id="username" style=" width:270px; height:54px; font-size:18px; line-height:54px;" value="请输入您的帐号" onFocus="if(value=='请输入您的帐号') {value=''}" onBlur="if(value==''){value='请输入您的帐号'}">
密码状态时 中上面的方法会显示不出字 而是默认的星号或者点 所以用下面的实现
密码框默认有字 鼠标点击后默认字消失
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<style type="text/css">
#inputs{width:300px;margin:50px auto;border:solid 1px #090;}
#password{display:none;}
</style>
<body>
<div id="inputs">
<input id="password" type="password" />
<input id="password_text" type="text" value="请输入密码" />
</div>
<script type="text/javascript">
window.onload=function(){
var pwd = document.getElementByIdx_x("password");
var pwd_text = document.getElementByIdx_x("password_text");
pwd_text.onfocus = function(){
pwd.style.display = "inline";
pwd_text.style.display = "none";
pwd.focus();
}
pwd.onblur=function(){
if(pwd.value==null || pwd.value=="" || pwd.value=="请输入密码"){
pwd.style.display="none";
pwd_text.style.display="inline";
}
}
}
</script>
</body>
</html>
