美文网首页Web 前端开发 让前端飞
提示框(点进来有惊喜哦)

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

作者: 踏雪寻梅美梅 | 来源:发表于2017-09-25 12:07 被阅读0次

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

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

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

    css:

    js:

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

    现在留给大家一个问题:

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

    欢迎大家评论哦!

    相关文章

      网友评论

        本文标题:提示框(点进来有惊喜哦)

        本文链接:https://www.haomeiwen.com/subject/fkbrextx.html