首页 - 神途礼包 > jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例

jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例

发布于：2024-08-03 作者：admin 阅读：122

本文实例讲述了实现input输入框获取焦点与失去焦点时提示的消失与显示功能。分享给大家供大家参考，具体如下：

最近都成为页面仔了，主要工作都放在了前段，以前总是写后台程序，对前端的一些技术 html,css, ,虽然都懂一些，但要做出比较好看页面，还是有很大的差距的。最近就遇到了这样一个要求不是很高，但有点小清新风格的登录或注册页面，要求如下：

1. 在输入框中 如果没有内容，则显示提示：比如"请输入用户名"2. 如果输入框获得焦点，则隐藏提示3. 如果输入框失去焦点，并且输入框没有内容，则显示提示，如果有内容，则隐藏提示。4. 采用 1.7.2

在搜索了资料之后，发现通过label, input 并结合 结合来实现，因为 label 有一个 for 属性，并指向input 的id ,这样，只要点击 label ,input 输入框就能获取焦点.一旦获取焦点就响应事件。隐藏label. 同样在失去焦点的时候，也触发事件，判断输入框是否有内容，来确定是否显示提示。整个效果如下：

获取焦点后

代码如下:





www.jb51.net jQuery input焦点与提示<a href="/sjyx/cwzyx/"  target=_blank title="纯文字游戏下载推荐" class=infotextkey>文字</a>







    www.jb51.net得到焦点时提示语消失

感兴趣的朋友可以使用在线HTML/CSS/代码运行工具 测试上述代码运行效果。

更多关于相关内容感兴趣的读者可查看本站专题：《 form操作技巧汇总》、《操作json数据技巧汇总》、《常用插件及用法总结》、《扩展技巧总结》、《表格(table)操作技巧汇总》及《选择器用法总结》

希望本文所述对大家程序设计有所帮助。

二维码

扫一扫关注我们

版权声明：本文内容由互联网用户自发贡献，本站不拥有所有权，不承担相关法律责任。如果发现本站有涉嫌抄袭的内容，请告知我们，本站将立刻删除涉嫌侵权内容。

上一篇：关于近期异常掉线问题的第一波补偿公告

下一篇：科技昨夜今晨0729：暴雪《炉石传说》国服9月25日回归

相关文章

本站资讯|联系我们|RSS订阅|网站地图

百度关键词：神途,神途手游,神途发布网

二维码

Copyright © 2022 www.5wst.com All right reserved. 赣ICP备2022000132号-15