首页 > > 网页制作 > Javascript >

toastr操作完成提示框

2018-11-26 07:54:39来源：博客园阅读 ()

　　关于信息提示框，项目中使用的是toastr.js这个组件，这个组件最大的好处就是异步、无阻塞，提示后可设置消失时间，并且可以将消息提示放到界面的各个地方。

官方文档以及源码

　　源码网站：http://codeseven.github.io/toastr/

　　api：http://www.ithao123.cn/content-2414918.html

引入js和css　　

    <link href="/static/js/toastr/toastr.css" rel="stylesheet">  
    <!--消息提示-->
    <script src="/static/js/toastr/toastr.js"></script>

设置提示框位置： toastr.options.positionClass = 'toast-bottom-right';

如toast-bottom-right表示下右、toast-bottom-center表示下中、toast-top-center表示上中等

<script type="text/javascript">
          toastr.options.positionClass = 'toast-bottom-right';
  </script>

在js中使用

toastr.success('提交数据成功');
toastr.error('Error');
toastr.warning('只能选择一行进行编辑');
toastr.info('info');

效果如下：

推荐学习网址：https://codeseven.github.io/toastr/demo.html

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有

热门词条

最新资讯

热门关注

热门标签