提示框(点进来有惊喜哦)

前段工作期间,负责修复移动端的缺陷,其中一个关于提示框的印象还比较深刻,所以拿来与大家一起分享。

在前端静态页面与后端接口都完成的情况下,最重要的环节就是前后端联调啦,我们如何知道接口是否请求成功呢?嗯,当然是和后端小伙伴约定好一个标志了,如flag:true,代表请求成功,false:代表请求失败,msg:失败成功原因。身为一名前端工程师,我们想必是要考虑到用户体验的,我们需要把这些信息展示给用户,这我就要跟大家讲到提示框了。以下就是关于如何实现一个简单提示框:

html:<div class="result-tip hide"></div>

css:

js:


这是拿到接口以后返回给用户的简单提示框(3秒消失),也可以用于页面不可操作时的提示信息。

现在留给大家一个问题:


像这样快速连续点击的话(点一下提示收藏成功。再点一下提示取消收藏成功),是否依然可以完美实现,js代码需不需要做改动????

欢迎大家评论哦!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,929评论 25 709
  • 即使这些动画可以通过一个淡出动画曲线来完成,我也想使用含有相同damping和stiffness值得弹簧动画,这样...
    Cloudox_阅读 1,364评论 0 0
  • 大家知道,原子都是由原子核和高速绕原子核运动的电子组成的,那么电子的运动,形成电流,而电流就形成了磁场,这样每个电...
    茶树菇打僵尸阅读 2,915评论 0 0
  • 走该走的路,遇见该遇见的人,不要害怕,不要犹豫,不要后悔,也不要留恋。 我喜欢在车站或者医院,去观察我遇到的人。职...
    孙大丫阅读 3,405评论 3 3
  • 不开心!已经写了两篇文章的账号竟然怎么也找不回了,妈蛋,好像是直接被销号了,文章也找不到,账号也找不到,花了一晚上...
    无ai阅读 1,576评论 0 1

友情链接更多精彩内容