`
seawavecau
  • 浏览: 754645 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

Ajax裸奔+XML传递数据

阅读更多

页面代码

<HTML>
<HEAD>
<%...@ page   
language="java"   errorPage="/ErrorPage.jsp"
contentType="text/html; charset=GBK"
pageEncoding="GBK"%>


<LINK href="<%=request.getContextPath()%>/include/default.css" rel="stylesheet" type="text/css">
<TITLE>营销记录统计</TITLE>
<SCRIPT language="JavaScript">...

    function send_request() ...{//初始化、指定处理函数、发送请求的函数
        
        http_request = false;
        //开始初始化XMLHttpRequest对象
        if(window.XMLHttpRequest) ...{ //Mozilla 浏览器
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) ...{//设置MiME类别
                http_request.overrideMimeType('text/xml');
            }
        }else if (window.ActiveXObject) ...{ // IE浏览器
            http_request = new ActiveXObject("Microsoft.XMLHTTP");
        }
        if (!http_request) ...{ // 异常,创建对象实例失败
            window.alert("不能创建XMLHttpRequest对象实例.");
            return false;
        }
        
        http_request.onreadystatechange = function()...{processRequest_return()};
        
        
        // 确定发送请求的方式和URL以及是否同步执行下段代码
        http_request.open("GET", "http://10.120.32.152:8080/examples/aa.xml", false);
        http_request.send(null);
    }
     function processRequest_return() ...{
        //alert("=="+http_request.status);
        if (http_request.readyState == 4) ...{ // 判断对象状态
            if (http_request.status == 200) ...{ // 信息已经成功返回,开始处理信息

                    // var objXml = http_request.responseXML;
                    // var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); 
                    //xmlDoc.async=false; 
                    //xmlDoc.load(objXml); 
                    
                    //var xmlRoot = xmlDoc.documentElement;
                    var students = http_request.responseXML.getElementsByTagName("student"); 
    
                     var cpbm="";
                     var cpmc="";
                     var temp="<select name="chanpin2" style=" width: 125px" onchange='javascript:document.form1.cpbm.value=this.value;'>";
                     temp+="<option value=''>请选择产品</option>";
                     for (var i = 0 ; i <students.length;i++)...{
                var stud = students[i]; //得一个stutdent结点
                var name = stud.getElementsByTagName("sname")[0].firstChild.data; //取结点里的数据
                var gre = stud.getElementsByTagName("gre")[0].firstChild.data; 
                var tse = stud.getElementsByTagName("tse")[0].firstChild.data; 
                         //cpbm=cpxl[i].childNodes[0].text;
                         cpmc=name + "=" + tse;
                         temp+="<option value="+gre+">"+cpmc+"</option>";
                     }
                    temp+="</select>";
                    document.getElementById("td2").innerHTML=temp;

         
            } else ...{ //页面不正常
                alert(http_request.status);
                alert("您所请求的页面有异常。");
            }
        }
    }
</SCRIPT>
</HEAD>
<BODY leftMargin=0 topMargin=0 MARGINWIDTH=0 MARGINHEIGHT=0>

<FORM name=form1 method=post action="">


<br>
<TABLE WIDTH="60%" border="0" cellpadding="0" cellspacing="1" >
      <TR BGCOLOR="#FFFFFF" height=20>
        <TD ALIGN="right" width=25%>产品大类</TD>
        <td width=25%>                                     
            
            <select name="chanpin1" style=" width: 125px" onchange="send_request();">
                        <OPTION value="">请选择产品</OPTION>
                        <OPTION value="00">—————</OPTION>
                        <OPTION value="4">新产品</OPTION>
                        <OPTION value="5">重点推荐</OPTION>
                        <OPTION value="6">推荐产品</OPTION>
                </select>
                <input type="hidden" name="cpbm" value="">
            </TD>
            <TD ALIGN="right" width=20%>产品小类</TD>
            <td id="td2" width=30%>                                     
            <select name="chanpin2" style=" width: 125px">
                        <OPTION value="">请选择产品</OPTION>
                </select>
            </TD>
      
      </TR>
</TABLE>
</Form>

</BODY>
</HTML>

 

aa.xml

<?xml version="1.0"?> 

<classmates> 
  <student> 
     <sid>1</sid> 
     <sname>name1</sname> 
     <gre>1700</gre> 
     <tse>121</tse> 
  </student> 
  <student> 
     <sid>2</sid> 
     <sname>name2</sname> 
     <gre>1800</gre> 
     <tse>122</tse> 
  </student> 
  <student> 
     <sid>3</sid> 
     <sname>name3</sname> 
     <gre>1900</gre> 
     <tse>123</tse> 
  </student> 
</classmates> 

 

当数据源是数据库的时候,http://IP/examples/aa.xml 可以改成是jsp或者servlet,通过out.println或者PrintWrite.out 回写。

分享到:
评论

相关推荐

    C#网站开发案例详解 基于Ajax+CSS+JavaScript+XML技术

    C#网站开发案例详解 基于Ajax+CSS+JavaScript+XML技术 源码

    简单的网页聊天ajax+js+xml

    【标题】"简单的网页聊天ajax+js+xml"揭示了这个项目是使用XMLHttpRequest(通常简称为AJAX)、JavaScript(JS)以及XML这三种技术来创建一个基础的网页聊天应用。AJAX是一种在不刷新整个页面的情况下,与服务器交换...

    ajax中使用xml传递数据

    2. **使用XML传递数据** 在DWR中,当需要发送XML数据到服务器时,可以创建一个XML字符串,然后作为参数传递给DWR的远程方法。同样,服务器响应也可以是XML格式,DWR会自动将其转换为JavaScript对象,以便在客户端...

    基于ASP的Ajax+XML简单房产程序 v1.0(适合学习ajax+xml).zip

    描述部分与标题相同,"基于ASP的Ajax+XML简单房产程序 v1.0(适合学习ajax+xml).zip",再次确认了这是一个用于教学目的的房产管理软件,它使用了Ajax技术来增强用户交互体验,同时利用XML处理数据。这个软件的源...

    源代码-Ajax+XML简单房产程序 v1.0(适合学习ajax+xml).zip

    该资源是一个名为"源代码-Ajax+XML简单房产程序 v1.0(适合学习ajax+xml).zip"的压缩包,主要针对想要学习Ajax和XML技术的IT学习者。Ajax,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种在...

    参考基于ASP+DIV+CSS+AJAX+XML+MSSQL技术开发的CMS网站管理系统

    参考基于ASP+DIV+CSS+AJAX+XML+MSSQL技术开发的CMS网站管理系统

    Ajax+GridView+Xml的简易留言薄

    Ajax+GridView+Xml的简易留言薄

    ASP源码—Ajax+XML简单房产程序 v1.0(适合学习ajax+xml).zip

    【ASP源码—Ajax+XML简单房产程序 v1.0】是一个适合初学者研究和学习AJAX(异步JavaScript和XML)与XML技术在ASP(Active Server Pages)环境中的应用的程序实例。在这个项目中,开发者可以深入理解如何通过AJAX实现...

    php+ajax+xml.rar_ajax php 无刷新_ajax xml_php xml_php 例子_xml

    标题中的"php+ajax+xml.rar_ajax php 无刷新_ajax xml_php xml_php 例子_xml"揭示了这个压缩包文件包含的内容是关于使用PHP、AJAX和XML技术实现的一个无刷新交互示例。这个组合通常用于创建动态网页,提供用户友好...

    ASP实例开发源码—Asp+Ajax+XML简单房产程序 v1.0(适合学习ajax+xml).zip

    ASP实例开发源码—Asp+Ajax+XML简单房产程序 v1.0 是一个适合初学者和进阶者学习AJAX(异步JavaScript和XML)与XML技术在ASP(Active Server Pages)环境中应用的示例项目。这个程序的目的是帮助开发者理解如何在Web...

    php+xml php+ajax php+mysql

    结合XML、AJAX和MySQL,可以构建出交互性强、数据处理高效的动态网站。下面将详细阐述这些技术及其相互之间的关系。 **PHP基础与高级** PHP(Hypertext Preprocessor)是一种开源的、跨平台的脚本语言,主要用于Web...

    ajax+xml企业公告管理系统

    总结来说,“ajax+xml企业公告管理系统”利用Ajax技术提高了交互性,实现了公告的高效管理和查看,同时XML作为数据交换和存储的格式,确保了数据的结构化和易处理性。结合这两者,系统为用户提供了流畅且便捷的企业...

    ado.net+ajax+html+css+jquery+oracle+xml+sqlserver参考手册

    标题中的“ado.net+ajax+html+css+jquery+oracle+xml+sqlserver”是一系列重要的IT技术,它们在Web开发中扮演着核心角色。这里将分别解析这些技术及其相互之间的关联,以及它们如何构建高效、交互式的Web应用程序。 ...

    ajax获取服务器以xml形式输出省市数据,并获取数据绑定前台下拉框和实现联动

    在本示例中,我们关注的是如何利用Ajax从服务器获取以XML(Extensible Markup Language)格式的数据,然后将这些数据绑定到前端的下拉框中,以及实现下拉框之间的联动效果。下面我们将详细探讨这一过程。 首先,XML...

    ajax + div +js +xml+ servlet 实现无限级动态目录树(原创)

    总结来说,这个项目综合运用了前端和后端技术,通过AJAX实现了动态加载和更新,利用div和JavaScript提供了良好的用户交互体验,XML作为数据交换格式,而Servlet则作为服务器端的数据处理中心。这种技术组合在现代Web...

    ajax + xml 实现的webQQ

    在WebQQ中,服务器将这些数据封装成XML文档,通过Ajax请求传递给客户端,客户端再解析XML并展示给用户。 5. **安全机制**:尽管Ajax提高了用户体验,但也带来了一些安全问题,如跨站脚本攻击(XSS)和跨站请求伪造...

    ajax + xml 省市县区四级联动

    Ajax(Asynchronous JavaScript and XML)是异步JavaScript和XML的缩写,它允许网页在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。通过使用Ajax,我们可以实现页面的局部刷新,提高网页的响应...

    AJAX+xml案例.zip

    这个"AJAX+xml案例.zip"文件显然包含了一些示例,旨在帮助用户理解如何结合使用这两种技术。以下是关于AJAX和XML在Web开发中的详细知识点: **1. AJAX基础** - **异步通信**: AJAX的核心是JavaScript的...

    ajax+xml实现省市区无刷新联动代码

    总结来说,"ajax+xml实现省市区无刷新联动代码"是利用Ajax技术和XML数据格式,为用户提供流畅的省市区选择体验,避免了传统方式下频繁的页面刷新,提高了网页的交互性和性能。通过理解Ajax的工作原理和XML的数据结构...

    自己写的一个AJAX+xml聊天室

    【标题】:“自己写的一个AJAX+xml聊天室” 在标题中提到的“AJAX+xml聊天室”是指一个基于Ajax技术和XML(eXtensible Markup Language)实现的在线实时聊天应用程序。Ajax,即Asynchronous JavaScript and XML,是...

Global site tag (gtag.js) - Google Analytics