# javascript-messagebox

**Repository Path**: StrutsTwo/javascript-messagebox

## Basic Information

- **Project Name**: javascript-messagebox
- **Description**: 一款原生js的弹窗程序
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-04-01
- **Last Updated**: 2024-04-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# javascript-messagebox

#### 介绍
QMessage.js 是 一款原生js的弹窗程序， 

#### 软件架构
使用，兼容IE>=9。HTML


#### 安装教程

1.  引入QMessage.css

```
<link rel="stylesheet" href="./css/QMessage.css">

```
2.  引入QMessage.js

```
<script src="./js/QMessage.js"></script>
```
#### 使用说明

1.  直接使用

```
    var configs = {};
    // configs 为配置参数，可省略
    Qmsg.info("这是提示消息",configs);
```

2.  全局配置

在引入message.js之前可以通过全局变量 QMSG_GLOBALS.DEFAULTS 来进行配置

```
window.QMSG_GLOBALS = {
    DEFAULTS:{
        showClose:true,
        timeout:5000
    }
}
```
或者通过Qmsg.config({})来动态修改全局配置:

```
Qmsg.config({
    showClose:true,
    timeout:5000
})
```

3.  所有支持的配置信息如下:

| 参数        | 类型       | 描述                        | 默认    |
|-----------|----------|---------------------------|-------|
| showClose | Boolean  | 是否显示关闭图标                  | false |
| timeout   | Number   | 多久后自动关闭，单位ms              | 2000  |
| autoClose | Boolean  | 是否自动关闭                    | true  |
| content   | String   | 提示的内容                     | ''    |
| onClose   | Function | 关闭的回调函数                   | null  |
| html      | Boolean  | 是否将内容作为html渲染             | false |
| maxNums   | Number   | 最多显示消息(autoClose:true)的数量 | 5     |


#### 支持的方法


```
Qmsg.info()
Qmsg.warning()
Qmsg.error()
Qmsg.success()
Qmsg.loading()
```

以上方法均可传递1-2个参数，如下：


```
Qmsg.loading("我是加载条");
Qmsg.info("给你个眼神，你懂得",{
    showClose:true,
    onClose:function(){
        console.log('我懂了')
    }
})
Qmsg.error({
    content:"1+1=3",
    timeout:5000
})
```
#### 注意

Qmsg.loading()默认修改autoClose=false,一般来说需要手动关闭：

```
var loadingMsg = Qmsg.loading('我是加载条');
//do something
loadingMsg.close();
```
如需要自动关闭则需要如下调用:

```
Qmsg.loading("我是加载条",{
    autoClose:true
})
//或者
Qmsg.loading({
    autoClose:true,
    content:"我是加载条"
})
Qmsg.closeAll()
```
关闭所有消息，包括autoClose=false的消息

消息实例支持的方法和属性

```
var aMsg = Qmsg.info("这是个info消息")
close()
```
关闭当前消息,会触发onClose回调函数。

```
aMsg.close()
destroy()
```
销毁消息，不会触发onClose回调函数。

```
aMsg.destroy()
timeout
```
多久后关闭，单位ms,设置该值可动态修改该消息实例的关闭时间，前提是该消息实例的autoClose==true
需要文件