一个AJAX列子，通过读取后台数据库数据转换为xml格式进行输出

最新推荐文章于 2018-06-12 18:31:19 发布

wolf_ben

最新推荐文章于 2018-06-12 18:31:19 发布

阅读量3k

点赞数

分类专栏： Ajax 文章标签： xml 数据库 ajax xmlhttprequest function xhtml

本文链接：https://blog.csdn.net/liu_ben_qian/article/details/6745402

版权

Ajax 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

这几天把AJAX重新温习了，做了个列子，下面就把这个自己做的列子贴出来分享下，有不足的地方请各位童鞋指正，如有不好的，请文明发言，谢谢~

在写代码的过程中，遇到一个可能大家都会遇到的问题，就是responseXML.documentElement返回一个空值的情况，后面参考了很多解决方案，总算运行成功了。

结起来，有三个原因会导致返回xml时为null：

1. 那就是没有设置返回的内容格式，只要在write前添加Response.ContentType = "text/xml";就可以了

2. xml的内容格式不正确，可以通过将xml的内容输出，好好检查xml的格式是否正确

3.这是因为没有关闭，所以会输出页面所有的html标签，而不只是xml文件，所以会为空

//这是getuserinfo.aspx，读取后台数据库中数据，以xml的形式返回，数据库大家根据代码很快就能设计好吧

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.Sql;
using System.Data.SqlClient;

public partial class getuserinfo : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (string.IsNullOrEmpty(Request.QueryString["q"]))
        {
            Response.Redirect("getuserinfo.aspx");
        }
        else
        {
            Response.Expires = -1;
            Response.ContentType = "text/xml";
            Response.Charset = "UTF-8";
            string str = "select * from custormer where id='" + Request.QueryString["q"] + "'";
            SqlDataReader dr = DB.getdatareader(str);
            while (dr.Read())
            {
                Response.Write("<?xml version='1.0' encoding='GB2312'?>");
                Response.Write("<company>");
                Response.Write("<compname>" + dr["companyname"] + "</compname>");
                Response.Write("<contname>" + dr["contname"] + "</contname>");
                Response.Write("<address>" + dr["address"] + "</address>");
                Response.Write("<city>" + dr["city"] + "</city>");
                Response.Write("<country>" + dr["country"] + "</country>");
                Response.Write("</company>");
                Response.End();//这句是关键，这是因为没有关闭，所以会输出页面所有的html标签，而不只是xml文件，所以会为空
            }
        }
    }
}

//这是Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default5" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Ajax测试</title>
</head>
<body>
    <script type="text/javascript">
        var xmlHttp = null;
        function readyStateChangeHandle() {
            if (xmlHttp.readyState == 4) {
                if (xmlHttp.status == 200) {
                    var xmlDoc = xmlHttp.responseXML.documentElement;
//                    alert(xmlDoc);测试
                    var companyname = document.getElementById("companyname");
                    var contactname = document.getElementById("contactname");
                    var address = document.getElementById("address");
                    var country = document.getElementById("country");
                    var city = document.getElementById("city");
                    try {
                        companyname.innerHTML = xmlDoc.getElementsByTagName("compname")[0].childNodes[0].nodeValue;
                        contactname.innerHTML = xmlDoc.getElementsByTagName("contname")[0].childNodes[0].nodeValue;
                        address.innerHTML = xmlDoc.getElementsByTagName("address")[0].childNodes[0].nodeValue;
                        country.innerHTML = xmlDoc.getElementsByTagName("country")[0].childNodes[0].nodeValue;
                        city.innerHTML = xmlDoc.getElementsByTagName("city")[0].childNodes[0].nodeValue;
                    }
                    catch (e) {
                        alert(e.message);
                    }
                }
            }
        }
        function ajaxRequest(str) {
            if (window.XMLHttpRequest) {
                xmlHttp = new XMLHttpRequest();
            }
            else if (window.ActiveXObject) {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            var url = "getuserinfo.aspx";
            url += "?q=" + str;
            url += "&id=" + Math.random();
            xmlHttp.onreadystatechange = readyStateChangeHandle;
            xmlHttp.open("GET", url, true);
            xmlHttp.send(null);
        }
    </script>
    <label>
        选择客户：
        <select name="id" οnchange="ajaxRequest(this.value)">
            <option value="1">1</option>
            <option value="2 ">2</option>
            <option value="3">3</option>
        </select></label>
    <br />
    <b><span id="companyname"></span></b>
    <br />
    <span id="contactname"></span>
    <br />
    <span id="address"></span>
    <br />
    <span id="city"></span>
    <br />
    <span id="country"></span>
</body>
</html>