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. MapReduce流量统计

    准备数据access.log 要用到的只有第二个手机号,倒数第三上行流量,倒数第二下行流量. 1363157985066 13726230503 00-FD-07-A4-72-B8:CMCC 120. ...

  2. OpenStack--Rabbitmq组件消息队列

    概念 队列 MQ 全称为Message Queue,消息队列( MQ ) 是一种应用程序的通信方法.应用程序通过读写入列队的消息(针对应用程序的数据)来通信,而无需专用连接来链接它们. 消息传递指的是 ...

  3. windows安装多个python及pip版本

    windows安装多个python及pip版本 1.下载所需要的python2和python3安装包 2.一路next 3.设置环境变量 4.修改python安装目录下的可执行程序名称 5.在cmd中 ...

  4. Linux系统基本结构——摘自《循序渐进linux》

    系统与硬件 系统资源管理器 查看系统PCI设备 lspci 列出所有的pci设备如主板.声卡.显卡.网卡.usb接口设备 lspci -v 更详细的pci信息 查看cpu信息 more /proc/c ...

  5. python requests下载图片

    # 文件下载方法 from urllib.request import urlretrieve import requests # 第一 urlimage = 'https://www.python. ...

  6. java web项目部署到tomcat 8.5 此驱动程序不支持 Java Runtime Environment (JRE) 1.8 版。请使用支持 JDBC 4.0 的 sqljdbc4.jar 类库

    1:项目使用的是jre1.8版本. 2:服务器 apache-tomcat-8.5.23 报错如下: 严重 [com.mchange.v2.async.ThreadPoolAsynchronousRu ...

  7. 解决Windows服务无法访问网络映射盘的问题

    下载工具psexec 下载地址:https://docs.microsoft.com/zh-cn/sysinternals/downloads/psexec 百度地址:https://pan.baid ...

  8. Topologies on product spaces of $\mathbb{R}$ and their relationships

    In this post, I will summarise several topologies established on the product spaces of \(\mathbb{R}\ ...

  9. Excel—图表函数

    OFFSET(引用函数)它可以找一个区域,把一个区域的值都拿回来 函数语法:OFFSET(从哪个单元格开始,这个单元格下移多少行开始,然后现在的位置再往右多少列开始,要取的值是现在的位置开始下移多少行 ...

  10. MYSQL可调用执行自定义SQL的代码

    DELIMITER $$ USE `mysql_wispeed01`$$ DROP PROCEDURE IF EXISTS `sp_execSQL`$$ CREATE DEFINER=`sa`@`%` ...