// 在bootstrap中可以,可以使用如下方式实现弹出提示信息自动消失,如果没有使用bootstrap框架,可以自定义样式

//tip是提示信息,type:'success'是成功信息,'danger'是失败信息,'info'是普通信息,'warning'是警告信息
function ShowTip(tip, type) {
var $tip = $('#tip');
if ($tip.length == 0) {
// 设置样式,也可以定义在css文件中
$tip = $('<span id="tip" style="position:fixed;top:50px;left: 50%;z-index:9999;height: 35px;padding: 0 20px;line-height: 35px;"></span>');
$('body').append($tip);
}
$tip.stop(true).prop('class', 'alert alert-' + type).text(tip).css('margin-left', -$tip.outerWidth() / 2).fadeIn(500).delay(2000).fadeOut(500);
} function ShowMsg(msg) {
ShowTip(msg, 'info');
} function ShowSuccess(msg) {
ShowTip(msg, 'success');
} function ShowFailure(msg) {
ShowTip(msg, 'danger');
} function ShowWarn(msg, $focus, clear) {
ShowTip(msg, 'warning');
if ($focus) {
     $focus.focus();
  if (clear) $focus.val('');
   }
return false;
}

效果图如下

3s后会自动消失,比原生的alert()体验更好

jQuery弹出提示信息自动消失简洁版的更多相关文章

  1. jQuery弹出提示信息简洁版(自动消失)

    之前看了有一些现成的blockUI.Boxy.tipswindow等的jQuery弹出层插件,可是我的要求并不高,只需要在保存后弹出提示信息即可,至于复杂点的弹出层-可以编辑的,我是直接用bootst ...

  2. Jquery地图热点效果-鼠标经过弹出提示信息

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  3. jQuery弹出窗口完整代码

    jQuery弹出窗口完整代码 效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/1.htm 1 <!DOCTYPE html PUBLIC "- ...

  4. 【如何使用jQuery】【jQuery弹出框】【jQuery对div进行操作】【jQuery对class,id,type的操作】【jquery选择器】

    1.如何使用jQuery jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗旨 ...

  5. Android N(7.0) 在ListView里显示EditText时软键盘弹出时会自动切换到全键盘的问题?

    Android N(7.0) 在ListView里显示EditText时软键盘弹出时会自动切换到全键盘的问题? 问题症状描述 Activity 在AndroidManifest.xml里设置andro ...

  6. thinkPHP5.0使用form表单提交数据和删除文章,不用TP的提示页面,使用弹出提示信息

    form表单提交数据和删除文章时,TP的默认信息提示页面的看起来不是很好看,想要实现弹窗提示怎么做呢? 前端:可以使用前端的一个知识--iframe,iframe元素会创建包含另外一个文档的内联框架: ...

  7. Bootstrap历练实例:弹出提示信息的样式按钮

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  8. Vue使用 weui picker 弹出框不消失

    前言 最近使用 weui 里面的 datepicker 组件的时候遇到了一个问题: 弹出来 选择年月日的框之后,直接点击导航上的“返回” 按钮,picker 选框不消失,也就是弹出框不消失 weui. ...

  9. jQuery弹出深色系层菜单

    低调奢华jQuery弹出层菜单,使用新版的jQuery库,兼容多种浏览器.Demo展示: http://hovertree.com/texiao/layer/3/ 本特效可以作为网站的引导页,使用jQ ...

随机推荐

  1. Mysql中类似于Oracle中connect by ... start with的查询语句(木大看懂)

    表结构 create table sys_branch ( id ) not null, parent_id ), branch_name ), delete_flag ), primary key ...

  2. 你应该掌握linux中Bash命令的一些快捷方式

    在本文中,我们将分享许多对任何Linux用户都有用的Bash命令行快捷方式.这些快捷方式可以快速地执行某些动作,例如访问和运行先前执行的命令,打开编辑器,在命令行上编辑/删除/更改文本,移动光标,控制 ...

  3. doDBA工具使用详解

    目录 1.简介 2.下载 3.使用帮助 4.配置 4.1.模板 4.2.启动命令 5.部署流程 5.1.下载 5.2.选定被监控主机 5.3.在被监控主机上添加Linux用户.MySQL 用户 5.4 ...

  4. 3. 键值对RDD

    键值对RDD是Spark中许多操作所需要的常见数据类型.除了在基础RDD类中定义的操作之外,Spark为包含键值对类型的RDD提供了一些专有的操作在PairRDDFunctions专门进行了定义.这些 ...

  5. Verilog的各种坑

    Verilog语言和软件语言不一样,有些时候理所当然的编写,也没有报语法错误,可是功能就是不对.唉,把遇到的坑都记在本篇博客吧. 1. initial begin...end里面不能有always,如 ...

  6. RESTful 的学习总结

    RESTful 的核心思想就是,客户端发出的数据操作指令都是"动词 + 宾语"的结构.比如,GET /articles这个命令,GET是动词,/articles是宾语.动词通常就是 ...

  7. 【转载】 C#使用string.IsNullOrWhiteSpace方法判断字符串是否为非空字符

    在C#编程过程中,很多时候需要判断传入过来的字符串是否为Null或者空字符或者空白字符,此时就可以使用到string.IsNullOrWhiteSpace方法来判断,如果字符串为null或者空字符Em ...

  8. js实现用户输入日期算出是今年的第几天

    const rs = require("readline-sync"); // 根据用户输入的年月日输出第几天 // 欢迎 console.log("欢迎来到查询系统&q ...

  9. 【layui】layer.photos 相册层动态生成Img 中出现的问题的解决方案

    layui版本:2.5.5 参照文档:https://www.jianshu.com/p/c594811fa882 他的3.8的解决方案有一些调整因为发现他的解决方式有些繁琐而最新的2.5.5版本中有 ...

  10. laravel——表操作集成操作

    背景:通过判断不同的请求参数,返回不同的需要的数据 一.准备工作: 数据库新建一个表 DROP TABLE IF EXISTS `tb_category2`; CREATE TABLE IF NOT ...