首页 > 代码库 > js和ajax处理方法

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=http://www.mamicode.com/# 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 onl oad="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>

js和ajax处理方法