EasyUI之消息窗口messager

来源：互联网发布：gevent 数据库编辑：程序博客网时间：2024/05/16 12:31

1.样式

消息窗口提供了不同的消息框风格，包含alert(警告框), confirm(确认框), prompt(提示框), progress(进度框)等。所有的消息框都是异步的。用户可以在交互消息之后使用回调函数去处理结果或做一些自己需要处理的事情。

2.练习1：生成消息窗口

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>messager</title><!-- 引入css文件 --><link rel="stylesheet" href="themes/default/easyui.css" type="text/css"></link><link rel="stylesheet" href="themes/icon.css" type="text/css"></link>        <!-- 引入js文件 --><script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/jquery.easyui.min.js"></script><script type="text/javascript" src="js/easyui-lang-zh_CN.js"></script></head><body>    </body><script type="text/javascript">    $.messager.confirm(        {            title:"消息窗口",            content:"注意身体"        }    );  </script></html>

结果：

3.文档

属性

属性名属性值类型描述默认值okstring确定按钮文本。Okcancelstring取消按钮文本。Cancel

方法

方法名方法参数描述$.messager.showoptions在屏幕右下角显示一条消息窗口。该选项参数是一个可配置的对象：
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.alerttitle, msg, icon, fn显示警告窗口。参数：
title：在头部面板显示的标题文本。
msg：显示的消息文本。
icon：显示的图标图像。可用值有：error,question,info,warning。
fn: 在窗口关闭的时候触发该回调函数。

代码示例：

$.messager.alert('我的消息','这是一个提示信息！','info');

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

代码示例

$.messager.confirm('确认对话框', '您想要退出该系统吗？', function(r){if (r){    // 退出操作;}});

$.messager.prompttitle, msg, fn显示一个用户可以输入文本的并且带“确定”和“取消”按钮的消息窗体。参数：
title：在头部面板显示的标题文本。
msg：显示的消息文本。
fn(val): 在用户输入一个值参数的时候执行的回调函数。

代码示例：

$.messager.prompt('提示信息', '请输入你的姓名：', function(r){if (r){alert('你的姓名是：' + r);}});

$.messager.progressoptions or method显示一个进度消息窗体。
属性定义为：
title：在头部面板显示的标题文本。默认：空。
msg：显示的消息文本。默认：空。
text：在进度条上显示的文本。默认：undefined。
interval：每次进度更新的间隔时间。默认：300毫秒。

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

代码示例：

显示进度消息窗口。

$.messager.progress();

关闭进度消息窗口。

$.messager.progress('close');

0 0