文本框的提示内容的显示和消失

最新推荐文章于 2023-05-16 13:24:40 发布

wojuranshigehaoren

最新推荐文章于 2023-05-16 13:24:40 发布

阅读量725

点赞数

本文链接：https://blog.youkuaiyun.com/wojuranshigehaoren/article/details/73613257

版权

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<meta charset="utf-8" />
</head>

<body>

<input id="Text1" type="text" value="请输入密码"/>
<input id="Text2" type="text" value="请输入用户名"/>
<script>
$("#Text1").focus(function () { var tr = $(this).val(); if (tr == "请输入密码") { $(this).val(""); } });
//聚焦的时候变化失去
$("#Text1").blur(function () { var tr = $(this).val(); if (tr == "") { $(this).val("请输入密码") } });
//失焦的时候再次出现
$("#Text2").focus(function () { var te = $(this).val(); if (te == "请输入用户名") { $(this).val(""); } });
$("#Text2").blur(function () { var te = $(this).val(); if (te == "") { $(this).val("请输入用户名") } });
// $("#Text1").focus(function () { var tr = $(this).val(); if (tr == this.defaultValue) { $(this).val(""); } });
// $("#Text1").blur(function () { var tr = $(this).val(); if (tr == "") { $(this).val("this.defaultValue") } });
//defaultValue代表当前文本的值;相同的结果
</script>
</body>
</html>