JQuery——AJAX

来源：互联网发布：gec虚拟币源码编辑：程序博客网时间：2024/06/03 21:47

改造我们使用纯js写的AJAX程序：

<html><head><script src="js/selectcustomer_xml.js"></script><script src="js/jquery-2.1.3.min.js"></script></head><body><form action=""><label>选择客户： <select name="customers"onchange="showCustomer(this.value)"><option value="1">Alfreds Futterkiste</option><option value="2">North/South</option><option value="3">Wolski Zajazd</option></select></label></form><b><span id="companyname"></span></b><br /><span id="contactname"></span><br /><span id="address"></span><span id="city"></span><br /><span id="country"></span></body></html>

jsp文件不变：

<%@ page pageEncoding="UTF-8" import="java.sql.*,java.io.*" %><%String q = request.getParameter("q");System.out.println(q);Connection conn = null;Statement stmt = null;try{String url= "jdbc:mysql://localhost:3306/test?user=root&password=root&useUnicode=true&characterEncoding=GB2312";Class.forName("com.mysql.jdbc.Driver").newInstance();    conn= DriverManager.getConnection(url);  String sql="SELECT * FROM CUSTOMERS ";sql=sql+" WHERE CUSTOMERID='"+q+"'";stmt = conn.createStatement();ResultSet rs = stmt.executeQuery(sql);response.setCharacterEncoding("utf-8");response.setHeader("ContentType","text/xml");response.setContentType("text/xml;charset=utf-8");//out.clear();PrintWriter out1 = response.getWriter();//out1.flush();out1.print("<?xml version='1.0' encoding='UTF-8'?>");while(rs.next()){System.out.println(rs.getString("companyname"));out1.print("<company>");out1.print("<compname>" +rs.getString("companyname")+ "</compname>");out1.print("<contname>" +rs.getString("contactname")+ "</contname>");out1.print("<address>" +rs.getString("address")+ "</address>");out1.print("<city>" +rs.getString("city")+ "</city>");out1.print("<country>"+rs.getString("country")+ "</country>");out1.print("</company>");}out1.flush();}catch(Exception e){out.print(e.getMessage());}finally{stmt.close();conn.close();}%>

主要是js部分使用了jquery的脚本：

function showCustomer(str) {$.ajax( {     url:'jsp/getcustomer_xml.jsp',// 跳转到 action        data:{            q : str        },        type:'post',        cache:false,        dataType:'xml',    success:function(xmlDoc) {         /*alert(xmlDoc);*/    /* document.getElementById("companyname").innerHTML = xmlDoc.getElementsByTagName("compname")[0].childNodes[0].nodeValue;     document.getElementById("contactname").innerHTML = xmlDoc.getElementsByTagName("contname")[0].childNodes[0].nodeValue;     document.getElementById("address").innerHTML = xmlDoc.getElementsByTagName("address")[0].childNodes[0].nodeValue;     document.getElementById("city").innerHTML = xmlDoc.getElementsByTagName("city")[0].childNodes[0].nodeValue;     document.getElementById("country").innerHTML = xmlDoc.getElementsByTagName("country")[0].childNodes[0].nodeValue;*/     $(xmlDoc).find('company').each(function()         {     $("#companyname").html($(this).children("compname").text());     $("#contactname").html($(this).children("contname").text());     $("#address").html($(this).children("address").text());     $("#city").html($(this).children("city").text());     $("#country").html($(this).children("country").text());    });     },         error : function() {              // view("异常！");              alert("异常！");         }   }); }

0 0