用jquery怎么实现点击密码输入框,上面的提示文字“请输入密码”消失,失去焦点时候提示文字又存在

没有获取焦点的时候:获取了焦点的时候:如果是用户名,我直接通过jquery控制input框的value值,但是密码框的type是password,是黑点,用这个方法就不行... 没有获取焦点的时候:

获取了焦点的时候:

如果是用户名,我直接通过jquery控制input框的value值,但是密码框的type是password,是黑点,用这个方法就不行了,新手求助,谢谢。
展开
 我来答
cainiaokan
推荐于2017-09-16 · TA获得超过2917个赞
知道小有建树答主
回答量:651
采纳率:66%
帮助的人:610万
展开全部

方法1.对于支持placeholder属性的浏览器。可以暂且认为除了老版本的IE系列浏览器都支持这个属性。可以直接在input标签上附加属性,如下:

<input type="password" name="pwd" placeholder="请输入密码" />

方法2.对于不支持placeholder属性的浏览器,使用一个相对定位的元素,使其偏移,浮在输入框上方。当用户点击这个偏移元素,或输入框获得焦点时,隐藏这个偏移元素,来模拟placeholder的效果。

清水栞
2014-09-16 · TA获得超过1547个赞
知道小有建树答主
回答量:1538
采纳率:50%
帮助的人:982万
展开全部
    <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>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
CT大耳牛
推荐于2017-09-29 · 超过28用户采纳过TA的回答
知道答主
回答量:73
采纳率:0%
帮助的人:54.4万
展开全部
<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('');
});
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
2010082423
2014-09-16 · TA获得超过281个赞
知道小有建树答主
回答量:121
采纳率:100%
帮助的人:110万
展开全部
只要在密码框的input 获得焦点时触发,当获得焦点时,控制value的同时,改变type属性,把type属性置为password 应该就行了,
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
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>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式