jsp：<div id="p" class="easyui-progressbar" style="width:400px;"></div>
js：
var timerId;
// 初始化方法
function init(){
//每隔0.5秒自动调用方法，实现进度条的实时更新
timerId=window.setInterval(getProgress,500);
$.ajax({
dataType: "json",
method: "post",
url: contextPath+"/XXXX/clearProgress.do"
})
$("#p").show();
$('#p').window({
title:'进度条',
width:420,
height:50,
modal:true,
minimizable:false,
maximizable: false,
closed: false,
collapsible:false
});
};
function getProgress()
{
$.ajax({
dataType: "json",
method: "post",
url: contextPath+"/XXX/getProgress.do"
}).done(function(data){
if(data.processInt>=100){
window.clearInterval(timerId);
$('#p').window('close');
}
$('#p').progressbar('setValue',data.processInt);
}).fail(function(){
$.messager.alert('告警',"本次操作失败，请重新操作",'error');
return false;
});
}
java：
int processInt = 0;
/**
*
* ??
* @author
* @param
* @param
* @return
* @see [类、类#方法、类#成员]
*/
@RequestMapping(value = "/clearProgress", method = RequestMethod.POST)
public @ResponseBody void clearProgress()
{
processInt = 0;
}
/**
*
* ??
* @author
* @param
* @param
* @return
* @see [类、类#方法、类#成员]
*/
@RequestMapping(value = "/getProgress", method = RequestMethod.POST)
public @ResponseBody Map<String, Object> getProgress()
{
Map<String, Object> map = new HashMap<String, Object>();
try
{
Random random=new Random();
processInt += random.nextInt(10);
}
catch (Exception e)
{
log.error("Exception:", e);
}
map.put("processInt", processInt);
return map;
}
实际项目中，只要将后台处理的过程的进度实时传递给公共变量processInt 即可。