jsp：<div id="p" class="easyui-progressbar" style="width:400px;"></div>
js：
var timerId;
// 初始化方法
function init(){
//每隔0.5秒自動調(diào)用方法，實現(xiàn)進度條的實時更新
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 即可。