<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() "://" request.getServerName() ":" request.getServerPort() path "/";
%>
<!-- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> -->
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<link rel="stylesheet" type="text/css" href="js/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="js/themes/icon.css">
<link rel="stylesheet" type="text/css" href="js/demo/demo.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
<script type='text/javascript'>
var timerId;
$(function(){
//每隔0.5秒自动调用方法，实现进度条的实时更新
timerId=window.setInterval(getForm,500);
});
function getForm(){
//使用JQuery从后台获取JSON格式的数据
$.ajax({
type:"post",//请求方式
url:"getProgressValueByJson",//发送请求地址
timeout:30000,//超时时间：30秒
dataType:"json",//设置返回数据的格式
//请求成功后的回调函数 data为json格式
success:function(data){
if(data.progressValue>=100){
window.clearInterval(timerId);
}
$('#p').progressbar('setValue',data.progressValue);
},
//请求出错的处理
error:function(){
window.clearInterval(timerId);
alert("请求出错");
}
});
}
</script>
</head>
<body>
<div style="margin:100px 0;"></div>
<div id="p" class="easyui-progressbar" style="width: 400px;"></div>
</body>
</html>
评论