简单打开和关闭
$.messager.progress({title: '请稍候',msg: '系统处理中...',text: '0%'});$.messager.progress('close');
easyui 普通提示
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>EasyUI Loading示例</title><link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css"><script type="text/javascript" src="https://code.jquery.com/jquery-3.6.0.min.js"></script><script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
</head>
<body><button onclick="startLoading()">开始加载</button><button onclick="closeLoading()">关闭加载</button><script>let loading;function startLoading() {loading = $.messager.progress({title: '请稍候',msg: '系统处理中...',text: '0%'});let value = 0;const interval = setInterval(() => {value += 10;if(value > 100) {clearInterval(interval);$.messager.progress('close');$.messager.alert('完成', '操作已成功完成');}loading.progressbar('setValue', value);loading.progressbar('setText', value + '%');}, 500);}function closeLoading() {if(loading) {$.messager.progress('close');}}</script>
</body>
</html>
文件上传进度
<script>
function advancedLoading() {const loading = $.messager.progress({title: '文件上传',msg: '正在上传大文件...',text: '初始化...',width: 300,height: 100,modal: true });const steps = ['准备文件', '计算哈希', '分片上传', '合并文件', '完成'];let stepIndex = 0;const interval = setInterval(() => {stepIndex++;if(stepIndex >= steps.length) {clearInterval(interval);loading.progressbar('setValue', 100);loading.progressbar('setText', '100%');setTimeout(() => {$.messager.progress('close');$.messager.show({title: '成功',msg: '文件上传完成！'});}, 500);return;}const progress = Math.round((stepIndex / steps.length) * 100);loading.progressbar('setValue', progress);loading.progressbar('setText', `${steps[stepIndex]} (${progress}%)`);}, 1000);
}
</script><button onclick="advancedLoading()">高级加载示例</button>
主要参数
const loading = $.messager.progress({title: '标题', msg: '消息内容', text: '初始文本', width: 300, height: 100, modal: true
});
获取进度条和设置进度条
const progressBar = loading.progressbar('bar');
progressBar.progressbar('setValue', 50);
