jsp에서 부분 페이지 새로 고침을 구현하는 방법: 먼저 ajax 요청을 처리하는 jsp 파일을 만든 다음 출력 정보의 형식과 문자 집합을 설정하고 마지막으로 JSP 및 ajax를 사용하여 부분 페이지 새로 고침을 구현합니다.
AJAX를 사용하면 JavaScript는 JavaScript의 XMLHttpRequest 개체를 사용하여 서버와 직접 통신할 수 있습니다. 이 개체를 통해 JavaScript는 페이지를 다시 로드하지 않고도 웹 서버와 데이터를 교환할 수 있습니다.
추천 과정: Java 튜토리얼.
AJAX는 브라우저와 웹 서버 간의 비동기 데이터 전송(HTTP 요청)을 사용하므로 웹 페이지가 전체 페이지 대신 서버에서 소량의 정보를 요청할 수 있습니다.
실험에서는 페이지를 자동으로 새로 고치고 데이터베이스의 데이터를 읽고 쓰는 데 JSP+ajax를 사용했습니다.
다음은 JSP+ajax를 사용하여 부분 페이지 새로 고침을 수행하는 간단한 예입니다.
ajax 요청을 처리하는 jsp 파일: ajax.jsp
<%@ page contentType="text/html; charset=gb2312" %> <% //这是一个Java程序 //设置输出信息的格式及字符集 response.setContentType("text/xml; charset=UTF-8"); response.setHeader("Cache-Control","no-cache"); out.println("<response>"); for(int i=0;i<2;i++){ out.println("<name>"+(int)(Math.random()*10)+ "号传感器</name>"); out.println("<count>" +(int)(Math.random()*100)+ "</count>"); } out.println("</response>"); out.close(); %>
ajax 요청을 보내는 jsp 파일: zx. jsp
<head> <META http-equiv=Content-Type content="text/html; charset=gb2312"> </head> <script language="javascript"> var XMLHttpReq; //创建XMLHttpRequest对象 function createXMLHttpRequest() { if(window.XMLHttpRequest) { //Mozilla 浏览器 XMLHttpReq = new XMLHttpRequest(); } else if (window.ActiveXObject) { // IE浏览器 try { XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {} } } } //发送请求函数 function sendRequest() { createXMLHttpRequest(); var url = "ajax.jsp"; XMLHttpReq.open("GET", url, true); XMLHttpReq.onreadystatechange = processResponse;//指定响应函数 XMLHttpReq.send(null); // 发送请求 } // 处理返回信息函数 function processResponse() { if (XMLHttpReq.readyState == 4) { // 判断对象状态 if (XMLHttpReq.status == 200) { // 信息已经成功返回,开始处理信息 DisplayHot(); setTimeout("sendRequest()", 1000); } else { //页面不正常 window.alert("您所请求的页面有异常。"); } } } function DisplayHot() { var name = XMLHttpReq.responseXML.getElementsByTagName("name")[0].firstChild.nodeValue; var count = XMLHttpReq.responseXML.getElementsByTagName("count")[0].firstChild.nodeValue; document.getElementById("product").innerHTML = name; document.getElementById("count").innerHTML = count; } </script> <body onload =sendRequest()> <table style="BORDER-COLLAPSE: collapse" borderColor=#111111 cellSpacing=0 cellPadding=0 width=200 bgColor=#f5efe7 border=0> <TR> <TD align=middle bgColor=#dbc2b0 height=19 colspan="2"><B>无线传感网</B> </TD> </TR> <tr> <td height="20"> 传感器:</td> <td height="20" id="product"> </td> </tr> <tr> <td height="20">传感器个数:</td> <td height="20" id="count"> </td> </tr> </body> </table>
효과는 다음과 같습니다(페이지의 값이 자동으로 변경됨):
부분 새로 고침 후:
위 내용은 JSP에서 부분 새로 고침을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!