<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><%String path = request.getContextPath();String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()+ path + "/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><base href="<%=basePath%>"><title>主页中间</title><link rel="stylesheet" href="css/public.css" /><link rel="stylesheet" href="css/style.css" /><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><script src="js/jquery.js"></script><script type="text/javascript">//全局xmlHttp对象var xmlHttp;//获得xmlHttp对象function createXMLHttp() {//对于大多数浏览器适用var xmlHttp;if (window.XMLHttpRequest) {xmlHttp = new XMLHttpRequest();}//考虑浏览器的兼容性if (window.ActiveXObject) {xmlHttp = new ActiveXOject("Microsoft.XMLHTTP");if (!xmlHttp) {xmlHttp = new ActiveXOject("Msxml2.XMLHTTP");}}return xmlHttp;}//回调函数function callback() {//4代表完成if (xmlHttp.readyState == 4) {//200代表服务器响应成功，404代表资源未找到，500服务器内部错误if (xmlHttp.status == 200) {//交互成功获得响应的数据，是文本格式var result = xmlHttp.responseText;var tableStart = "<table id=‘test‘ class=‘providerTable‘ cellpadding=‘0‘ cellspacing=‘0‘ align=‘center‘ width=‘100%‘><tr>"var head = "<tr class=‘firstTr‘><th width=‘10%‘>终端号</th><th width=‘20%‘>终端名称</th><th width=‘20%‘>终端类型</th><th width=‘20%‘>终端状态</th><th width=‘20%‘>终端IP地址</th><th width=‘10%‘>终端音量</th></tr>"var tdStart = "<td>"var tdEnd = "</td>"//定义表格结束标签 ;var tableEnd = "</tr></table>"document.getElementById("t1").innerHTML = tableStart + head + tableEnd;var json1 = eval("(" + result + ")");for (i = 0; i < json1.length; i++) {// 追加行 ;var oRow1 = test.insertRow(test.rows.length);// 获取表格的行集合。 var aRows = test.rows;// 获取第一行的单元格集合。 var aCells = oRow1.cells;// 在第一行中插入两个单元格。 var oCell1_1 = oRow1.insertCell(aCells.length);var oCell1_2 = oRow1.insertCell(aCells.length);var oCell1_3 = oRow1.insertCell(aCells.length);var oCell1_4 = oRow1.insertCell(aCells.length);var oCell1_5 = oRow1.insertCell(aCells.length);var oCell1_6 = oRow1.insertCell(aCells.length);var json = json1[i];/* if(json.terminalState="断线"){ json.terminalIPAddress=""; json.terminalVol="" } else{} */var terminalID = tdStart + json.terminalID + tdEnd var terminalIPAddress = tdStart + json.terminalIPAddress + tdEndvar terminalName = tdStart + json.terminalName + tdEndvar terminalState = tdStart + json.terminalState + tdEnd ???var terminalType = tdStart + json.terminalType + tdEndvar terminalVol = tdStart + json.terminalVol + tdEnd// 向单元格内填充数据 ; ???????oCell1_1.innerHTML = terminalID;oCell1_2.innerHTML = terminalName;oCell1_3.innerHTML = terminalType;oCell1_4.innerHTML = terminalState;oCell1_5.innerHTML = terminalIPAddress;oCell1_6.innerHTML = terminalVol ;}setTimeout(getContents, 1000);}}}//获得内容function getContents() {//首先获得用户的输入内容，这里获得的是一个结点//var content = document.getElementById("keyword");//if(content.value ==""){// ?return;//}//向服务器发送内容，用到XmlHttp对象xmlHttp = createXMLHttp();//给服务器发送数据，escape()不加中文会有问题var url = "Test";//true表示js的脚本会在send()方法之后继续执行而不会等待来自服务器的响应xmlHttp.open("GET", url, true);//xmlHttp绑定回调方法，这个方法会在xmlHttp状态改变的时候调用,xmlHttp状态有0-4，//我们只关心4，4表示完成xmlHttp.onreadystatechange = callback;xmlHttp.send(null);}/* setInterval(function(){$("#t1").load(location.href+"#v1>*","");},3000); */</script></head><body onload="getContents()"><section class="publicMian " id="t1"> <!--表格 样式公用--></section></body></html>
package com.cscy.servlet;import java.io.IOException;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import hy.com.port.BroadcastImpl;import hy.com.rmi.entity.TerminalInfomation;import net.sf.json.JSONArray;public class TestServlet extends HttpServlet {/** * ?*/private static final long serialVersionUID = 1L;@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {req.setCharacterEncoding("utf-8"); ???resp.setCharacterEncoding("utf-8"); ???????TerminalInfomation[] terminalInfo = BroadcastImpl.getTerminalInfomation(); ??resp.getWriter().write(JSONArray.fromObject(terminalInfo).toString()); ???}}
实现网页不刷新页面的情况下动态刷新表格数据
原文地址：https://www.cnblogs.com/songjiabo/p/9082391.html