js和ajax处理方法
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%-- <%request.setCharacterEncoding("utf-8"); %> --%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<title>Insert title here</title>
</head>
<script type="text/javascript">
function getResult(stateVal) {
var url = "MainServlet";
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
if (req) {
req.open("GET", url, true);
req.onreadystatechange = function() {
if (req.readyState == 4 && req.status == 200) {
var result = req.responseText;
processor(result); } }; req.send(null); } } function processor(result) { var categoryTable = document.getElementById("categoryTable"); var categotys = result.split(";"); for(var i in categotys) { if(categotys[i] == null || ‘‘ == categotys[i]) { continue; } var fields = categotys[i].split(","); var j = 0; var tr = document.createElement("tr"); var td1 = document.createElement("td"); var td2 = document.createElement("td"); td1.innerHTML = fields[j].split(":")[1]; td2.innerHTML ="<a href=# onclick= getCategoryId(" + fields[j].split(":")[1] + ");>" + fields[j+1].split(":")[1] + "</a>"; tr.appendChild(td1); tr.appendChild(td2); categoryTable.appendChild(tr); } } /* function descRow(categoryid) { alert(categoryid); getCategoryId(categoryid); //document.body.innerHTML = document.body.innerHTML + "<br>" + result; } */ function getCategoryId(categoryid) { var url = "MainCateId?state="+categoryid; if (window.XMLHttpRequest) { req = new XMLHttpRequest(); } else if (window.ActiveXObject) { req = new ActiveXObject("Microsoft.XMLHTTP"); } if (req) { req.open("GET", url, true); req.onreadystatechange = function() { if (req.readyState == 4 && req.status == 200) { var descResult = req.responseText; productDesc(descResult); } }; req.send(null); } } function productDesc(descResult) { var productTable = document.getElementById("productTable"); //document.body.innerHTML = document.body.innerHTML + "<br>" + descResult; var products = descResult.split(";"); for(var i in products) { //id:1,categoryid:1,normalprice:3000.0,name:电视,memberprice:2000.0,descr:海信,pdate:2014-09-24 08:33:53.0; //id:3,categoryid:1,normalprice:3000.0,name:电脑,memberprice:2000.0,descr:dell,pdate:2014-09-24 08:36:12.0; if(products[i] == null || ‘‘ == products[i]) { continue; } var fields = products[i].split(","); for(var j in fields) { var tr = document.createElement("tr"); var td1 = document.createElement("td"); var td2 = document.createElement("td"); td1.innerHTML = fields[j].split(":")[0]; td2.innerHTML = fields[j].split(":")[1]; tr.appendChild(td1); tr.appendChild(td2); productTable.appendChild(tr); } } } </script> <body onload="getResult()">
<h1>欢迎你<%=request.getParameter("user")%></h1> <table border = ‘2‘ id=‘categoryTable‘> <tr> <td width="20%">编号</td> <td width="50%">类型</td> </tr> </table> <br><br><br> <table border =‘2‘ id =‘productTable‘> <tr> <td width="20%">商品内容</td> <td width="30%">商品详情</td> </tr> </table> </body> </html>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
