html文本框提示字不消失

html文本框提示字不消失,第1张

文本框加上placeholder属性就可以了,这样文本框获得焦点文字不会消失,只有当文本框的值改变之后才会消失。

下面是参考代码:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Html5基本结构</title>

</head>

<body>

<input type="text" placeholder="请输入文本">

</body>

</html>

效果:

正如你所说

的,这个候选列表是HTML控件自动生成的。当你在这个

文本框

中输入值后,并且没有清除

临时文件

,下一次在文本框中输入时,它会出现相匹配的候选列表(以第一个字符开始匹配)

<script type="text/javascript">

 $(document).ready(function(){

   $("#focus .input_txt").each(function(){

     var thisVal=$(this).val()

     //判断文本框的值是否为空,有值的情况就隐藏提示语,没有值就显示

     if(thisVal!=""){

       $(this).siblings("span").hide()

      }else{

       $(this).siblings("span").show()

      }

     //聚焦型输入框验证 

     $(this).focus(function(){

       $(this).siblings("span").hide()

      }).blur(function(){

        var val=$(this).val()

        if(val!=""){

         $(this).siblings("span").hide()

        }else{

         $(this).siblings("span").show()

        } 

      })

    })

    $("#keydown .input_txt").each(function(){

     var thisVal=$(this).val()

     //判断文本框的值是否为空,有值的情况就隐藏提示语,没有值就显示

     if(thisVal!=""){

       $(this).siblings("span").hide()

      }else{

       $(this).siblings("span").show()

      }

      $(this).keyup(function(){

       var val=$(this).val()

       $(this).siblings("span").hide()

      }).blur(function(){

        var val=$(this).val()

        if(val!=""){

         $(this).siblings("span").hide()

        }else{

         $(this).siblings("span").show()

        }

       })

     }) 

  })

</script>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7007636.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-31
下一篇 2023-03-31

发表评论

登录后才能评论

评论列表(0条)

保存