.messager.show options 在屏幕右下角显示一条消息窗口。该选项参数是一个可配置的对象:
showType:定义将如何显示该消息。可用值有:null,slide,fade,show。默认:slide。
showSpeed:定义窗口显示的过度时间。默认:600毫秒。
width:定义消息窗口的宽度。默认:250px。
height:定义消息窗口的高度。默认:100px。
title:在头部面板显示的标题文本。
msg:显示的消息文本。
style:定义消息窗体的自定义样式。
timeout:如果定义为0,消息窗体将不会自动关闭,除非用户关闭他。如果定义成非0的树,消息窗体将在超时后自动关闭。默认:4秒。

代码示例:

$.messager.show({
title:'我的消息',
msg:'消息将在5秒后关闭。',
timeout:5000,
showType:'slide'
});
// 消息将显示在顶部中间
$.messager.show({
title:'我的消息',
msg:'消息将在4秒后关闭。',
showType:'show',
style:{
right:'',
top:document.body.scrollTop+document.documentElement.scrollTop,
bottom:''
}
});
$.messager.alert title, msg, icon, fn 显示警告窗口。参数:
title:在头部面板显示的标题文本。
msg:显示的消息文本。
icon:显示的图标图像。可用值有:error,question,info,warning。
fn:
在窗口关闭的时候触发该回调函数。

代码示例:

$.messager.alert('我的消息','这是一个提示信息!','info');
$.messager.confirm title, msg, fn 显示一个包含“确定”和“取消”按钮的确认消息窗口。参数:
title:在头部面板显示的标题文本。
msg:显示的消息文本。
fn(b):
当用户点击“确定”按钮的时侯将传递一个true值给回调函数,否则传递一个false值。

代码示例

$.messager.confirm('确认对话框', '您想要退出该系统吗?', function(r){
if (r){
// 退出操作;
}
});
$.messager.prompt title, msg, fn 显示一个用户可以输入文本的并且带“确定”和“取消”按钮的消息窗体。参数:
title:在头部面板显示的标题文本。
msg:显示的消息文本。
fn(val):
在用户输入一个值参数的时候执行的回调函数。

代码示例:

$.messager.prompt('提示信息', '请输入你的姓名:', function(r){
if (r){
alert('你的姓名是:' + r);
}
});
$.messager.progress options or method 显示一个进度消息窗体。
属性定义为:
title:在头部面板显示的标题文本。默认:空。
msg:显示的消息文本。默认:空。

text:在进度条上显示的文本。默认:undefined。
interval:每次进度更新的间隔时间。默认:300毫秒。

方法定义为:
bar:获取进度条对象。
close:关闭进度窗口。

代码示例:

显示进度消息窗口。

	$.messager.progress();

关闭进度消息窗口。

	$.messager.progress('close');

例子:

1、alert

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>My JSP 'message01.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="js/jquery-easyui-1.2.6/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.2.6/jquery.easyui.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.2.6/locale/easyui-lang-zh_CN.js"></script> <link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/themes/icon.css">
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/themes/gray/easyui.css">
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/demo/demo.css">
</head> <body>
<h2>Alter Messager</h2>
<p>点击每一个按钮显示不同的消息框</p>
<div style="margin:20px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="alert1()">Alert</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="alert2()">Error</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="alert3()">Info</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="alert4()">Question</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="alert5()">Warning</a>
</div>
<script>
function alert1(){
$.messager.alert('My Title','Here is a message!');
}
function alert2(){
$.messager.alert('My Title','Here is a error message!','error',function(){
alert("消息框完成了");
});
}
function alert3(){
$.messager.alert('My Title','Here is a info message!','info');
}
function alert4(){
$.messager.alert('My Title','Here is a question message!','question');
}
function alert5(){
$.messager.alert('My Title','Here is a warning message!','warning');
}
</script>
</body>
</html>

2、show和progress

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>My JSP 'message01.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="js/jquery-easyui-1.2.6/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.2.6/jquery.easyui.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.2.6/locale/easyui-lang-zh_CN.js"></script> <link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/themes/icon.css">
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/themes/gray/easyui.css">
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/demo/demo.css">
</head> <body>
<h2>Alter Messager</h2>
<p>点击每一个按钮显示不同的消息框</p>
<div style="margin:20px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="show()">Show</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="slide()">Silde</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="fade()">Fade</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="progess()">Progess</a>
</div>
<script>
function show(){
$.messager.show({
title:'My Title',
msg:'Message will be closed after 4 second',
showType:'show'
});
}
function slide(){
$.messager.show({
title:'My Title',
msg:'Message will be closed after 5 second',
timeout:5000,
showType:'slide'
});
}
function fade(){
$.messager.show({
title:'My Title',
msg:'Message never be closed.',
timeout:0,
showType:'fade'
});
}
function progess(){
$.messager.progress({
title:'Please waiting',
msg:'Loading data...',
text:'Loading ...',
interval:500
});
setTimeout(function(){
$.messager.progress('close');
},5000);
}
</script>
</body>
</html>

3、confirm和prompt

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>My JSP 'message01.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="js/jquery-easyui-1.2.6/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.2.6/jquery.easyui.min.js"></script>
<script type="text/javascript" src="js/jquery-easyui-1.2.6/locale/easyui-lang-zh_CN.js"></script> <link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/themes/icon.css">
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/themes/gray/easyui.css">
<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.2.6/demo/demo.css">
</head> <body>
<h2>Alter Messager</h2>
<p>点击每一个按钮显示不同的消息框</p>
<div style="margin:20px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="confirm1()">confirm</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="prompt1()">prompt</a>
</div>
<script>
function confirm1(){
$.messager.confirm("My Title","Are you confirm this?",function(r){
if(r){
alert("confirmed: "+r);
}
});
}
function prompt1(){
$.messager.prompt("My Title","Please type something",function(r){
if(r){
alert("you type: "+r);
}
});
}
</script>
</body>
</html>

message消息框的更多相关文章

  1. 在vue项目中的main.js中直接使用element-ui中的Message 消息提示、MessageBox 弹框、Notification 通知

    需求来源:向后台请求数据时后台挂掉了,后台响应就出现错误,不做处理界面就卡住了,这时需要在main.js中使用axios的响应拦截器在出现相应错误是给出提示.项目使用element-ui,就调用里面的 ...

  2. WPF弹出带蒙板的消息框

    效果图 思路 拿到父级窗体的内容,放入一个容器里,再在容器里放入一个半透明层.将整个容器赋给父级窗体的内容. 关闭时反向操作. 代码 消息窗弹出时 /// <summary> /// 弹出 ...

  3. 【C#】分享一个可携带附加消息的增强消息框MessageBoxEx

    --------------201507160917更新--------------- 无意中发现标准消息框在Windows7是有声音的,只是在Windows server 2008(R2)无声,而我 ...

  4. 用Javascript弹出div定义的消息框并往块里面填写文字

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. WndProc Message消息解释

    public class WindowsMessage { public const int WM_NULL = 0x0000; // public const int WM_CREATE = 0x0 ...

  6. ftk学习记(消息框篇)

    [ 声明:版权全部,欢迎转载,请勿用于商业用途.  联系信箱:feixiaoxing @163.com] 上一篇说到了输入框.闲话不多说,首先看结果显示, 大家看看效果是不是和我们之前说的一样.今天, ...

  7. EasyUI Messager 消息框

    通过 $.messager.defaults 重写默认的 defaults. 消息框(messager)提供不同样式的消息框,包括警示(alert).确认(confirm).提示(prompt).进展 ...

  8. windows程序设计 MessageBox消息框

    MessageBox函数 int WINAPI MessageBoxW( HWND hWnd,//窗口句柄 LPCWSTR lpText,//消息框主体显示的字符串 LPCWSTR lpCaption ...

  9. VBA消息框

    MsgBox函数显示一个消息框,并等待用户点击一个按钮,然后根据用户点击该按钮的动作执行. 语法 MsgBox(prompt[,buttons][,title][,helpfile,context]) ...

随机推荐

  1. linux上安装Kafka

    写个一篇kafka文章了.但是那都是针对性能来说的,下面看一下完整的,kafka步骤: 安装单机三个 Broker 的 Kafka 集群,使用 Kafka 集群发布和接收消息.学完本课程,对 Kafk ...

  2. JavaEE应用基础平台 AOS-V0.1 RELEASED

    写在最前面 AOS是一个有着悠久历史传承和发扬的平台.她的前世G4Studio自2010年公布V1.0版本号以来,先后经过多次版本号更新.并得到了一些小伙伴的认可和使用.但我们希望做得更好,走得更远. ...

  3. github-readme.md-格式

    大标题 大标题一般显示project名,类似html的<h1> 你仅仅要在标题以下跟上=====就可以 中标题 中标题一般显示重点项,类似html的<h2> 你仅仅要在标题以下 ...

  4. python 基础 9.5 数据库连接池

      一. 数据库连接池    python 编程中可以使用MySQLdb 进行数据库的连接及诸如查询,插入,更新等操作,但是每次连接mysql 数据库请求时,都是独立的去请求访问,相当浪费资源,而且访 ...

  5. ULN2003A 使用,有坑

    8脚接24V负极 9脚接24V正极 16接24V继电器,再接到24V正极 1-7无论给5V 正 或 负,10-16都不能达到24V,越靠近输入端的输出端电压越大,最大的才11V,最小的2.5V 最后发 ...

  6. python多任务处理

    多任务解析 什么叫“多任务”呢?简单地说,就是操作系统可以同时运行多个任务. 现在,多核CPU已经非常普及了,但是,即使过去的单核CPU,也可以执行 多任务.由于CPU执行代码都是顺序执行的,那么,单 ...

  7. 软RAID5制作流程

    说明:本实验没有用到多个磁盘,而是利用单个磁盘划分出的多个分区来仿真的,如果在实际项目中,请依情况而定. 1. 分区 我这里划分6个分区,用4个分区组成RAID 5,用1个分区作为spare disk ...

  8. [ArcGIS]Oracle RAC下创建地理数据库(Create Enterprise Geodatabase)失败的解决方法

    转载请注明原文地址:http://www.cnblogs.com/litou/p/8028843.html 环境:Oracle 11g 11.2.0.1.0(双节点RAC群集),ArcGIS Desk ...

  9. react-native 使用 antd-mobile-rn UI进行开发app

    1.创建 react-native 项目 react-native init app03 2.安装组件 npm install antd-mobile-rn --save 3.配置按需加载 npm i ...

  10. Android中关于系统Dialog无法全屏的问题(dialog样式)

    自定义一个Dialog,继承了系统Dialog的样式.这时候会发现,即使布局文件中写的width和height都是match_parent,依然无法达到全屏的效果. 原因是:系统dialog的样式.默 ...