用jquery怎么实现点击密码输入框，上面的提示文字“请输入密码”消失，失去焦点时候提示文字又存在
没有获取焦点的时候：
获取了焦点的时候：
如果是用户名，我直接通过jquery控制input框的value值，但是密码框的type是password，是黑点，用这个方法就不行了，新手求助，谢谢。
方法1.对于支持placeholder属性的浏览器。可以暂且认为除了老版本的IE系列浏览器都支持这个属性。可以直接在input标签上附加属性，如下：
<input type="password" name="pwd" placeholder="请输入密码" />方法2.对于不支持placeholder属性的浏览器，使用一个相对定位的元素，使其偏移，浮在输入框上方。当用户点击这个偏移元素，或输入框获得焦点时，隐藏这个偏移元素，来模拟placeholder的效果。
温馨提示：答案为网友推荐，仅供参考
第1个回答 2014-09-16
<input type="text" id="pwd" />
<input type="hidden" id="pwdvalue" />
<script type="text/javascript">
var pwd = document.getElementById("pwd");
var pwdvalue = document.getElementById("pwdvalue");
pwd.onkeypress = function() {
var code = arguments[0].keyCode
pwdvalue.value += String.fromCharCode(code);
arguments[0].returnValue = false;
pwd.value += "x";
}
</script>
<input type="hidden" id="pwdvalue" />
<script type="text/javascript">
var pwd = document.getElementById("pwd");
var pwdvalue = document.getElementById("pwdvalue");
pwd.onkeypress = function() {
var code = arguments[0].keyCode
pwdvalue.value += String.fromCharCode(code);
arguments[0].returnValue = false;
pwd.value += "x";
}
</script>
第2个回答 推荐于2017-09-29
<input type="text" id="pwds" />
$("input#pwds").on('blur', function(){
var obj = $(this);
obj.attr('type', 'text').val('密码');
}).on('focus', function(){
var obj = $(this);
obj.attr('type', 'password').val('');
});本回答被提问者采纳
$("input#pwds").on('blur', function(){
var obj = $(this);
obj.attr('type', 'text').val('密码');
}).on('focus', function(){
var obj = $(this);
obj.attr('type', 'password').val('');
});本回答被提问者采纳
第3个回答 2014-09-16
只要在密码框的input 获得焦点时触发，当获得焦点时，控制value的同时，改变type属性，把type属性置为password 应该就行了，
第4个回答 2014-09-16
仅供参考
<html>
<head>
<script src="./jquery-1.9.1/jquery-1.9.1.min.js"></script>
<script>
$(function() {
var pwd = $("#pwd");
pwd.attr("type","text");
pwd.bind("focus",function() {
pwd.attr("type","password");
pwd.attr("value","");
});
pwd.bind("blur",function() {
var pwdtext = pwd.val();
if(pwdtext.length === 0){
pwd.attr("type","text");
pwd.attr("value","密码");
}
});
});
</script>
</head>
<body>
<form>
<input id="pwd" type="password" value="密码">登录
</form>
</body>
</html>
<html>
<head>
<script src="./jquery-1.9.1/jquery-1.9.1.min.js"></script>
<script>
$(function() {
var pwd = $("#pwd");
pwd.attr("type","text");
pwd.bind("focus",function() {
pwd.attr("type","password");
pwd.attr("value","");
});
pwd.bind("blur",function() {
var pwdtext = pwd.val();
if(pwdtext.length === 0){
pwd.attr("type","text");
pwd.attr("value","密码");
}
});
});
</script>
</head>
<body>
<form>
<input id="pwd" type="password" value="密码">登录
</form>
</body>
</html>
相似回答