两种方法实现text输入框中“请输入关键字”的提醒

最新推荐文章于 2023-02-02 11:27:35 发布

weixin_30326515

最新推荐文章于 2023-02-02 11:27:35 发布

阅读量536

点赞数

文章标签：前端开发工具 ViewUI

原文链接：http://www.cnblogs.com/topzhao/p/9194094.html

版权

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8 <div style="margin: 0 auto;width: 600px">
 9 <input id="i1" type="text" onfocus="Focus()" onblur="Blur()"  value="请输入关键字"/>
10 <input type="text" placeholder="请输入关键字">
11 </div>
12 
13 
14 <script>
15 
16     function Focus() {
17         var tag = document.getElementById('i1');
18         var  val =tag.value;  // 获取text中的值
19         if(val=="请输入关键字"){
20             tag.value='';
21         }
22     }
23     
24     function Blur() {
25         var tag = document.getElementById('i1');
26         var val = tag.value;
27         if(val.length==0){//判断长度是不是0
28             tag.value="请输入关键字"
29         }
30     }
31 
32 </script>
33 
34 </body>
35 </html>

效果如下图：

转载于:https://www.cnblogs.com/topzhao/p/9194094.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_30326515

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
两种方法实现text输入框中“请输入关键字”的提醒

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 </head> 7 <body> 8 <div styl...
复制链接

扫一扫