2 zengyunhua1992 zengyunhua1992 于 2016.09.13 23:55 提问

使用jquery模仿一些邮箱登录时的输入提示功能 请给点提示 这个我不太清楚方向

图片说明模仿一些邮箱登录时的输入提示功能:对于空白文本框,当没有鼠标未进入文本框时,显示银灰色的提示文本如“请输入邮箱地址”;当鼠标鼠标进入时,清除提示文本,让用户输入信息,用户输入的文本不再是银灰色,而应该是正常黑色;若用户没有输入信息又离开文本框时,文本框还原银灰色的提示信息。如下图所示:

6个回答

wxl1555
wxl1555   2016.09.14 00:46
已采纳
 <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script src="jquery-1.12.3.js" charset="utf-8"></script>
</head>
<body>
  <input type="text" name="name"  placeholder="请输入用户名"></br>
  <input type="password" name="name"  placeholder="请输入密码"></br>
  <input type="submit" name="name" value="登录">

</body>
<script type="text/javascript">
//是用焦点和失去焦点事件处理
  $('input').on("focus",function(){
  //接受原有的placeholder的value;
    var val = this.placeholder;
    //获取焦点让placeholder为空;
    this.placeholder = "";
    //获取焦点才能失去焦点,所以失去焦点函写在获取焦点里面
    $('input').on('blur',function(){
      //失去焦点后,placeholder变回原有的值
      this.placeholder = val;
    })
  });


</script>
</html>

就是这些代码,有啥不懂得继续问

wxl1555
wxl1555 placeholder不能实现你说的需求,鼠标点上去value还存在,除非打字就没有了,我的回答是按照你的需求来的
大约一年之前 回复
wxl1555
wxl1555 回复zengyunhua1992: 分开写是jq的方法不是js原生的方法,js原生的是onfocus写在一起的
大约一年之前 回复
zengyunhua1992
zengyunhua1992 有点不明白,就比如不用placeholder可以实现同样的效果吗?还有那个onfocus 和 onblur 事件 可以把on (focus)分开写?
大约一年之前 回复
zengyunhua1992
zengyunhua1992 好的。谢谢。
大约一年之前 回复
qq_29594393
qq_29594393   Ds   Rxr 2016.09.14 00:00

其实就是一个属性而已placeholder,加上去,随意填

 <input type="" name="" id="" value=""  placeholder="请输入密码"/>
qq_29594393
qq_29594393 回复zengyunhua1992: 好吧,这是系统自带的,确实没有手写的好,楼上处理的6666
大约一年之前 回复
zengyunhua1992
zengyunhua1992 你这样是有点小问题的,当获取焦点时,你的input 栏不会为空
大约一年之前 回复
showbo
showbo   Ds   Rxr 2016.09.14 09:28

找jquery.placeholder插件。placeholder属性 ie8-不支持

zengyunhua1992
zengyunhua1992 好的。谢谢。
大约一年之前 回复
devmiao
devmiao   Ds   Rxr 2016.09.13 23:58
qq_16877261
qq_16877261   2016.09.14 08:23

可以看看jquery的验证validate插件。很有用奥

zengyunhua1992
zengyunhua1992 好的。谢谢。
大约一年之前 回复
qq_29594393
qq_29594393   Ds   Rxr 2016.09.14 00:30

突然好想说一句,咋老是你。。。。。。。

zengyunhua1992
zengyunhua1992 嘿嘿、还真这么有缘,不知道就要问嘛,多一种思路能够更快更好的开阔视野,谢谢同僚
大约一年之前 回复
sinat_28978689
sinat_28978689 突然好想说一句,怎么也老是你,前端大神
大约一年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片