html页面：

<%@page contentType="text/html; charset=Shift_JIS"%>
<html>
    <head>
        <title>equipment</title>

<script type="text/javascript" language="javascript">
    var req;

//initialize request.
    function initRequest(url) {
        if (window.XMLHttpRequest) {
            req = new XMLHttpRequest();
        } else if (window.ActiveXObject) {
            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主要部分：

public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        System.out.println("begin");
        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();
        System.out.println("end");
    }

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>

摘自：http://blog.csdn.net/amose/archive/2005/06/07/389793.aspx

使用JavaScript动态刷新页面局部内容的更多相关文章

  1. Ajax初步实现页面局部内容更替

    类似于QQ邮箱的那种局部页面跳转,单页应用常用到,目前很多网页都是这种,但是弊端就是一次加载过多资源,首次加载卡出翔啊

  2. 浅析PHP页面局部刷新功能的实现小结(转)

    转载地址 https://www.jb51.net/article/38901.htm 方法其实挺多的.以前比较常用的是iframe这样来做.现在多了个ajax,所以一般情况下都是用的ajax.第一种 ...

  3. window.print() 打印页面部分内容的方法

    用 JavaScript 实现页面数据的打印 : 主要是用到了一个 print() 函数 , 该函数将会打印整个 web 页面 body 内的所有 html 数据 ! 使用方法为 window.pri ...

  4. ehcache实现页面整体缓存和页面局部缓存

    之前写过spring cache和ehcache的基本介绍和注解实现缓存管理,今天记录下web项目的页面缓存技术. 页面缓存是否有必要?. 这样说吧,几乎所有的网站的首页都是访问率最高的,而首页上的数 ...

  5. Django1.6 + jQuery Ajax + JSON 实现页面局部实时刷新

    最近微信公众帐号要扩展做一个签到系统,签到结果在一个网页上实时更新,即页面局部刷新.我想用Ajax来实现,之前公众帐号是用的Django搭的,我查找了Django的官方文档,没有封装Ajax.网上有各 ...

  6. JavaScript禁用页面刷新

    JavaScript禁用页面刷新代码如下: //禁用F5刷新 document.onkeydown = function () { if (event.keyCode == 116) { event. ...

  7. Javascript在页面加载时的执行顺序【转】

    一.在HTML中嵌入Javasript的方法 直接在Javascript代码放在标记对<script>和</script>之间 由<script />标记的src属 ...

  8. jquery实现页面局部刷新

    后台管理中总是使用frameset进行分成部分进行管理,但是感觉很不好用,尤其是页面间调转还要判断window.parent,太令我费神了,于是学习使用XMLHttpRequest进行页面局部刷新.代 ...

  9. ASP.NET缓存全解析3：页面局部缓存 转自网络原文作者李天平

    有时缓存整个页面是不现实的,因为页的某些部分可能在每次请求时都需要变化.在这些情况下,只能缓存页的一部分.顾名思义,页面部分缓存是将页面部分内容保存在内存中以便响应用户请求,而页面其他部分内容则为动态 ...

随机推荐

  1. AI学习---深度学习&TensorFlow安装

    深度学习   深度学习学习目标: 1. TensorFlow框架的使用 2. 数据读取(解决大数据下的IO操作) + 神经网络基础 3. 卷积神经网络的学习 + 验证码识别的案例   机器学习与深度学 ...

  2. Qt的事件

    Qt的事件机制 事件过滤器: 可以让一个对象侦听拦截另外一个对象的事件. 实现原理: 在所有Qt对象的基类:QObject中有一个 类型为:QObjectList 名字为:eventFilters 的 ...

  3. ubuntu下配置rsync，实现远程备份

    rysnc(remote synchronize)在CentOS系统默认安装在/usr/bin,此外rysnc在windows平台下也有相应版本.主页地址为: http://rsync.samba.o ...

  4. 【vue】使用localStorage解决vuex在页面刷新后数据被清除的问题

    通常,我们在使用vue编写页面时,会需要使用vuex在组件间传递(或者说共同响应)同一个数据的变化.例如:用户的登录信息. 下面,我们使用传递用户登录信息的例子来一步步解决这个问题. 首先,我们的第一 ...

  5. （转）ElasticSearch教程——汇总篇

    https://blog.csdn.net/gwd1154978352/article/details/82781731 环境搭建篇 ElasticSearch教程——安装 ElasticSearch ...

  6. 【CQOI2011】放棋子

    [CQOI2011]放棋子 在一个n行m列的棋盘里放一些彩色的棋子,使得每个格子最多放一个棋子,且不同颜色的棋子不能在同一行或者同一列.有多少种方法? 例如\(,n=m=3\),有两个白棋子和一个灰棋 ...

  7. 设计模式のChainOfResponsibilityPattern（责任链模式）----行为模式

    一.产生背景 职责链模式是一种行为模式,为解除请求的发送者和接收者之间的耦合,而使多个对象都有机会处理这个请求.将这些对象连接成一条链,并沿着这条链传递该请求,直到有一个对象处理它.避免请求发送者与接 ...

  8. 远程连接排错-屌丝去洗浴中心之路(windows)

    1.查看道路是否通畅 ip地址是什么:就是我们要找的服务器在哪里 公网IP地址:全世界的任何地方都能访问到 私网IP地址:也指内网,私有环境,只在当前环境中.比如:192.168.0.??? 或者 1 ...

  9. 大学？做码农？做project师？

        近期看到一个知乎里非常热闹的讨论.当中讨论到科研能力与project能力,我有非常多感想. 想说说大学CS方向的一些东西.     我不是计算机专业的,如今大二本科工科在读.     我接触编 ...

  10. pytorch学习-WHAT IS PYTORCH

    参考:https://pytorch.org/tutorials/beginner/blitz/tensor_tutorial.html#sphx-glr-beginner-blitz-tensor- ...