使用JQuery实现输入框placeholder效果

最新推荐文章于 2021-09-08 18:00:06 发布

咸康康

最新推荐文章于 2021-09-08 18:00:06 发布

阅读量545

点赞数

分类专栏： JavaScript 文章标签： jQuery html JavaScript

本文链接：https://blog.csdn.net/weixin_42886104/article/details/86475455

版权

JavaScript 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

<head>
  <meta charset="utf-8">
  <title>使用JQuery练习placehold</title>
  <script type="text/javascript" src="jquery-3.3.1.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
        
      $("input").blur(function(event) {
          //当失去焦点，判断当前值是否为空
        if ($(this).val() == "") {
            //如果为空，则返回默认值
          $(this).val(this.defaultValue);
        }
      });
      $("input").focus(function(event) {
          //当点击输入框时，首先判断当前文本框的值是不是默认值
        if ($(this).val() == "请输入账号"||$(this).val() == "请输入密码") {
            //如果是则清空
          $(this).val("");
        }else {
            //如果不是，则保留当前输入的值
          $(this).val(this.value);
        }
      });
    })
  </script>
</head>
<body>
  <div class="all">
    账户：<input type="text" name="1" value="请输入账号" >
    密码： <input type="mima" name="2" value="请输入密码">
  </div>
</body>

咸康康

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
使用JQuery实现输入框placeholder效果

&lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;使用JQuery练习placehold&lt;/title&gt; &lt;script type="text/javascript" src="jquery-3.3.1.js"&gt;&lt;/script&gt; &
复制链接

扫一扫