明輝手游網(wǎng)中心:是一個免費提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺!

JSP編程進(jìn)度條設(shè)計案例(4)

[摘要]三、任務(wù)進(jìn)度   status.jsp頁面利用一個HTML進(jìn)度條向用戶顯示任務(wù)的執(zhí)行情況。首先,status.jsp利用<jsp:useBean>標(biāo)記獲得start.jsp頁面創(chuàng)建的Bean對象: <jsp:useBean id="task" scope=&q...

  三、任務(wù)進(jìn)度


  status.jsp頁面利用一個HTML進(jìn)度條向用戶顯示任務(wù)的執(zhí)行情況。首先,status.jsp利用<jsp:useBean>標(biāo)記獲得start.jsp頁面創(chuàng)建的Bean對象:


<jsp:useBean id="task" scope="session"
    class="test.barBean.TaskBean"/>


  為了及時反映任務(wù)執(zhí)行進(jìn)度,status.jsp會自動刷新。JavaScript代碼setTimeout("location='status.jsp'", 1000)將每隔1000毫秒刷新頁面,重新請求status.jsp,不需要用戶干預(yù)。


<HTML>


<HEAD>
    <TITLE>JSP進(jìn)度條</TITLE>
    <% if (task.isRunning()) { %>
        <SCRIPT LANGUAGE="JavaScript">
            setTimeout("location='status.jsp'", 1000);
        </SCRIPT>
    <% } %>
</HEAD>


<ODY>


  進(jìn)度條實際上是一個HTML表格,包含10個單元——即每個單元代表任務(wù)總體的10%進(jìn)度。


<H1 ALIGN="CENTER">JSP進(jìn)度條</H1>


    <H2 ALIGN="CENTER">
        結(jié)果: <%= task.getResult() %><BR>
        <% int percent = task.getPercent(); %>
        <%= percent %>%
    </H2>


    <TABLE WIDTH="60%" ALIGN="CENTER"
            BORDER=1 CELLPADDING=0 CELLSPACING=2>
        <TR>
            <% for (int i = 10; i <= percent; i += 10) { %>
                <TD WIDTH="10%" BGCOLOR="#000080">&nbsp;</TD>
            <% } %>
            <% for (int i = 100; i > percent; i -= 10) { %>
                <TD WIDTH="10%">&nbsp;</TD>
            <% } %>
        </TR>
    </TABLE>
 
  任務(wù)執(zhí)行情況分下面幾種狀態(tài):正在執(zhí)行,已完成,尚未開始,已停止:


<TABLE WIDTH="100%" BORDER=0 CELLPADDING=0 CELLSPACING=0>
        <TR>
            <TD ALIGN="CENTER">
                <% if (task.isRunning()) { %>
                    正在執(zhí)行
                <% } else { %>
                    <% if (task.isCompleted()) { %>
                        完成
                    <% } else if (!task.isStarted()) { %>
                        尚未開始
                    <% } else { %>
                        已停止
                    <% } %>
                <% } %>
            </TD>
        </TR>