easyui的messager的属性
时间: 2024-05-28 09:14:03 浏览: 14
easyui 的 messager 组件是一个消息提示框组件,常用于向用户显示信息。该组件有以下常用属性:
- `title`:消息提示框的标题,默认为“消息”。
- `msg`:要显示的消息内容,可以是字符串或 HTML 代码。
- `timeout`:消息提示框自动关闭的时间(毫秒),默认为 3000。
- `showType`:消息提示框的显示方式,取值为 slide、fade、show,默认为 show。
- `style`:消息提示框的样式,可以是一个 CSS 样式字符串或一个样式对象。
- `width`:消息提示框的宽度,默认为 250。
- `height`:消息提示框的高度,默认为 100。
- `minWidth`:消息提示框的最小宽度,默认为 200。
- `minHeight`:消息提示框的最小高度,默认为 100。
- `maxWidth`:消息提示框的最大宽度,默认为 500。
- `maxHeight`:消息提示框的最大高度,默认为 300。
- `showSpeed`:消息提示框的显示动画速度(毫秒),默认为 600。
- `hideSpeed`:消息提示框的隐藏动画速度(毫秒),默认为 200。
- `showDelay`:消息提示框的显示延迟时间(毫秒),默认为 0。
- `hideDelay`:消息提示框的隐藏延迟时间(毫秒),默认为 0。
- `onOpen`:消息提示框打开时触发的事件。
- `onClose`:消息提示框关闭时触发的事件。
以上是 easyui 的 messager 组件的常用属性,可以根据实际需要进行配置。
相关问题
easyui的messager的alert的属性
easyui 的 messager 组件中的 alert 方法用于显示带有“确定”按钮的消息提示框,常用于向用户显示一些重要信息。该方法有以下常用属性:
- `title`:消息提示框的标题,默认为“消息”。
- `msg`:要显示的消息内容,可以是字符串或 HTML 代码。
- `icon`:消息提示框的图标,取值为 error、question、info、warning,默认为 info。
- `width`:消息提示框的宽度,默认为 250。
- `height`:消息提示框的高度,默认为 100。
- `fn`:用户点击“确定”按钮时触发的回调函数。
以上是 easyui 的 messager 组件中的 alert 方法的常用属性,可以根据实际需要进行配置。需要注意的是,alert 方法没有自动关闭的功能,用户必须点击“确定”按钮才能关闭消息提示框。如果需要自动关闭的功能,可以使用 easyui 的其他组件实现。
easyui的messager如何变成上下滚动
如果需要将 easyui 的 messager 组件变成上下滚动的形式,可以使用 easyui 的 window 组件。具体实现步骤如下:
1. 在页面中引入 easyui 的 window 组件:
```html
<link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/easyui/1.8.0/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/easyui/1.8.0/themes/icon.css">
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/easyui/1.8.0/jquery.easyui.min.js"></script>
```
2. 创建一个 window 元素,并设置其属性:
```html
<div id="mywindow" class="easyui-window" title="消息提示" data-options="
closed: true,
draggable: false,
minimizable: false,
maximizable: false,
collapsible: false,
resizable: false,
width: 300,
height: 150,
content: '<ul id=\'mylist\'></ul>'
"></div>
```
其中,`content` 属性设置窗口中的内容为一个无序列表。
3. 初始化 window 中的选项:
```javascript
$('#mywindow').window({
onOpen:function(){
setInterval(function(){
$('#mylist').prepend('<li>这是一条新消息</li>');
$('#mylist li:last').remove();
}, 2000);
}
});
```
这里使用了一个定时器,每隔 2 秒钟在列表的顶部添加一条新消息,同时移除列表的最后一条消息,实现了消息的上下滚动。
4. 弹出 window:
```javascript
$('#mywindow').window('open');
```
通过以上步骤,就可以将 easyui 的 messager 组件变成上下滚动的形式了。需要注意的是,这种方式只是实现了消息的上下滚动,如果需要在消息中添加操作按钮等其他功能,还需要进行相应的扩展。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)