toastr.js组件

  关于信息提示框,项目中使用的是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

toastr操作完成提示框的更多相关文章

  1. 60、常规控件(3)Snackbar-可操作的提示框,Toast升级版

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app=&quo ...

  2. JS组件系列——Bootstrap寒冬暖身篇:弹出框和提示框效果以及代码展示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

  3. Bootstrap:弹出框和提示框效果以及代码展示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

  4. JS组件Bootstrap实现弹出框和提示框效果代码

    这篇文章主要介绍了JS组件Bootstrap实现弹出框和提示框效果代码,对弹出框和提示框感兴趣的小伙伴们可以参考一下 前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编 ...

  5. Bootstrap实现弹出框和提示框效果代码

    一.Bootstrap弹出框使用过JQuery UI应该知道,它里面有一个dialog的弹出框组件,功能也很丰富.与jQuery UI的dialog类似,Bootstrap里面也内置了弹出框组件.打开 ...

  6. Bootstrap篇:弹出框和提示框效果以及代码展示

     前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你 ...

  7. js弹出框、对话框、提示框、弹窗总结

    一.JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹出对话框并输出一段提示信息 funct ...

  8. JQUERY 简单易用的提示框插件

    业务开发过程中,为了避免用户的误操作,提示框是必要的,于是琢磨出了下面这个使用,方便的提示框 还要引入遮罩层的样式如下: /*弹出层*/.input{height: 32px;border: 1px ...

  9. js js弹出框、对话框、提示框、弹窗总结

    js弹出框.对话框.提示框.弹窗总结 一.JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹 ...

随机推荐

  1. Nginx下完美解决WordPress的伪静态 (wordpress 迁移后 导致 页面404)

    直奔主题 如何设置WordPress在 Nginx下的伪静态 第一步:按照文章名为例,登陆后台按照箭头顺序修改固定连接,点击保存更改 第二步:登陆宝塔面板后台,按照文件路径 找到属于要配置域名的con ...

  2. MFC-注册热键

    0.测试环境 VS2015专业版,基于对话框的MFC程序, 例子地址:http://pan.baidu.com/s/1qX9IRec 1.MFC工程设置 类向导->消息->WM_HOTKE ...

  3. AspNet Core下利用 app-metrics+Grafana + InfluxDB实现高大上的性能监控界面

    在日常系统工作中,我们为了洞察系统的问题和运作情况通常会记录日志的方式来进行分析,但是在很多情况下都是被动的在出问题后才会去查日志.在很多时候,我们可能更需要相对实时的了解整个系统或者某一时段的运行的 ...

  4. JMeter调试参数是否取值正确,调试正则提取的结果(log.info|log.error|print)

    JMeter调试参数是否取值正确,调试正则提取的结果(log.info | log.error | print) Jmeter的log输出控制(jmeter.log) 1 2 log_level.jm ...

  5. zabbix企业级监控dell硬件服务状态

    监控dell服务的硬件状态,一般有两种方式 第一,在操作熊上安装OMSA,编写脚本调用omreport命令进行监控 第二.使用IDRAC,只需开启在IARAC上的SNMP,zabbix通过snmp进行 ...

  6. 为什么 kubernetes 天然适合微服务

    最近总在思考,为什么在支撑容器平台和微服务的竞争中,Kubernetes 会取得最终的胜出,事实上从很多角度出发三大容器平台从功能方面来看,最后简直是一摸一样.(可参考<容器平台选型的十大模式: ...

  7. Mac下使用数据库将Excel数据转换存入.plist

    记录于2013/10/26   基本步骤: 1.将Excel表格另存为.csv格式 2.用类似TextWrangler工具将.csv文件转成UTF-8格式 3.使用火狐插件SQLite Manager ...

  8. <算法图解>读书笔记:第3章 递归

    第3章 递归 3.1 递归 程序调用自身的编程技巧称为递归( recursion).递归做为一种算法在程序设计语言中广泛应用. 一个过程或函数在其定义或说明中有直接或间接调用自身的一种方法,它通常把一 ...

  9. vue-cli 2篇官方文档记录收藏

    https://cli.vuejs.org/guide/ http://vuejs-templates.github.io/webpack/

  10. linux-centos基本使用(一)

    1. 基本配置 1.常用软件安装 yum install -y bash-completion vim lrzsz wget expect net-tools nc nmap tree dos2uni ...