您的位置：首页 > Web前端 > JavaScript

使用JavaScript动态刷新页面局部内容

2005-06-07 16:59 666 查看

JavaScript部分：
<%@page contentType="text/html; charset=Shift_JIS"%>
<html>
<head>
<title>equipment</title>
<script type="text/javascript" language="javascript">
    var isIE = false;
    var req;
    //initialize request.
    function initRequest(url)
    {
      if (window.XMLHttpRequest)
      {
        req = new XMLHttpRequest();
      }
      else if (window.ActiveXObject)
      {
        isIE = true;
        req = new ActiveXObject("Microsoft.XMLHTTP");
      }
      req.open("GET", url, true);
    }

    //start work
    function work() {
      //target servlet
      var url = "equipmentservlet";
      //initialize request
      initRequest(url);
      // set callback function
      req.onreadystatechange = displayStatus;
      //do
      req.send(null);

    }
    function displayStatus()
    {
      if (req.readyState == 4)
      {
        if (req.status == 200)
        {
          var i = 0;
          var str = req.responseText;
          if(str == null ||str.length != 7)
          {
          }
          else
          {
            for(i = 0; i < 7 ; i++)
            {
              var status = str.charAt(i);
              setStatus(i, status);
            }
          }
          setTimeout("work()", 6000);
        }
      }
    }
    function setStatus(i, status)
    {
       var labelName = 'equipment_' + i;
    var idiv = window.document.getElementById(labelName);
     if(status == '1')
            {
              idiv.innerHTML= '<font color="red">error</font>';
            }
            if(status == '0')
            {
              idiv.innerHTML= '<font color="black">good</font>';
            }
    }
</script>
</head>

<body bgcolor="#ffffff" onLoad="work();">
<h1>    設備
    <br>
    <table border="1">
      <tr>
        <td>設備 0</td><td> <div id="equipment_0"></div></td>
      </tr>
   <tr>
        <td>設備 1</td><td> <div id="equipment_1"></div></td>
      </tr>
      <tr>
        <td>設備 2</td><td> <div id="equipment_2"></div></td>
      </tr>
      <tr>
        <td>設備 3</td><td> <div id="equipment_3"></div></td>
      </tr>
      <tr>
        <td>設備 4</td><td> <div id="equipment_4"></div></td>
      </tr>
      <tr>
        <td>設備 5</td><td> <div id="equipment_5"></div></td>
      </tr>
      <tr>
        <td>設備 6</td><td> <div id="equipment_6"></div></td>
      </tr>

    </table>
</h1>
</body>
</html>
Servlet部分：
package dynamicflush;
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.*;
import java.util.*;

public class EquipmentServlet
    extends HttpServlet
{
    //Initialize global variables
    public void init() throws ServletException
    {
    }
    //Process the HTTP Get request
    public void doGet(HttpServletRequest request, HttpServletResponse response) throws
        ServletException, IOException
    {
        response.setContentType("text/xml");
        response.setHeader("Cache-Control", "no-cache");
        PrintWriter pw = response.getWriter();
        StringBuffer buf = new StringBuffer();
        for(int i = 0; i < 7; i++)
        {
            int status = (int)(Math.random() * 2);
            buf.append("" + status );
        }
        System.out.println("message:/n" + buf.toString() + "/n");
        pw.write(buf.toString());
        pw.flush();
    }
    //Process the HTTP Post request
    public void doPost(HttpServletRequest request, HttpServletResponse response) throws
        ServletException, IOException
    {
        doGet(request, response);
    }
    //Clean up resources
    public void destroy()
    {
    }
}
web.xml部分：
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>
<display-name>equipment</display-name>
<servlet>
    <servlet-name>equipmentservlet</servlet-name>
    <servlet-class>dynamicflush.EquipmentServlet</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>equipmentservlet</servlet-name>
    <url-pattern>/equipmentservlet</url-pattern>
</servlet-mapping>
</web-app>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： javascript xmlhttprequest servlet function import div

相关文章推荐

新的分享

章节导航