AJAX使用post发送数据xml格式接受数据

注意点：

1. 用POST发送数据，在2号线函数（也是ajax发送数据的函数：ajaxCall）必须加上一句：xmlObject.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

接着使用xmlObject.send(data);发送

2.3号线函数要注意：

1.禁用缓存（建议，不必要）：header("Cache-Control:no-cache");

2.使用XML数据格式必须加上：header("Content-Type: text/xml; charset=gb2312");//这里要写XML

3.若使用WAMP5集成环境安装的MYSQL，在查询数据库时候，必须加上：

$charset = "gb2312";

mysql_query("SET character_set_connection=$charset, character_set_results=$charset, character_set_client=binary"); //这句是必须的，解决中文乱码加密问题s

否则就会乱码加密，今天我就是在这里浪费了很久时间，我是用ECSHOP GBK版 默认安装的数据库

4.若用XML接受数据，回调函数必须分IE和非IE处理，否则总是有一方娶不到XML数据

处理代码如下：

代码如下:

function getXMLData(tagName)//获取XML数据，分IE和非IE处理
{
var info;

if(window.ActiveXObject) //IE取回XML文件方法
{
var doc = new ActiveXObject("MSxml2.DOMDocument");

doc.loadXML(xmlObject.responseText);

info = doc.getElementsByTagName(tagName);

}
else //---------------------------非IE取回XML文件方法
{
info = xmlObject.responseXML.getElementsByTagName(tagName);

}

return info;
}

下面就是我做的一个省市联动测试

代码如下：

index.php

代码如下:

<!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=gb2312" />
<title>省事联动测试</title>
<style type="text/css" >
select{
width:100px;
}
</style>
<script type="text/javascript" >

var thisId = ""; //当前操作的selectI的D

var xmlObject; //ajax 对象全局变量，

function getAjaxObject()//AJAX 1号线,返回一个AJAX 对象引擎
{
var xmlObject ;

if(window.ActiveXObject)
{

xmlObject = new ActiveXObject("Microsoft.XMLHTTP");
}
else
{
xmlObject = new XMLHttpRequest();
}

return xmlObject ;
}

function ajaxCall(id) //ajax 二号线 ，这里采用 post 传递参数
{
xmlObject = new getAjaxObject();

if(xmlObject)
{
var url = "chuli.php";

var data = "id=" + id;

xmlObject.open("post",url,true);

xmlObject.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

xmlObject.onreadystatechange = repayFuncion;

xmlObject.send(data);

}

}

function repayFuncion() //ajax 四号线 ，这里采用 xml 接受数据，这里还涉及到xmldom编程
{

if(xmlObject.readyState==4 && xmlObject.status==200)
{

var info = getXMLData("res");//获取XML数据

$(thisId).length = 0;//清楚select 中的option节点

for(i=0;i<info.length;i++)
{

var optionId = info[i].childNodes[0].childNodes[0].nodeValue;

var optionValue = info[i].childNodes[1].childNodes[0].nodeValue;

var optionNode = document.createElement('option');

optionNode.value = optionId;

optionNode.innerText =optionValue;

$(thisId).appendChild(optionNode);

}

}

}

function getXMLData(tagName)//获取XML数据，分IE和非IE处理
{
var info;

if(window.ActiveXObject) //IE取回XML文件方法
{
var doc = new ActiveXObject("MSxml2.DOMDocument");

doc.loadXML(xmlObject.responseText);

info = doc.getElementsByTagName(tagName);

}
else //---------------------------非IE取回XML文件方法
{
info = xmlObject.responseXML.getElementsByTagName(tagName);

}

return info;
}

function $(id)//常用函数，通过ID取对象
{
return document.getElementById(id);
}

function getProvice()//获取省
{
thisId = "Province";

var id = '1';

ajaxCall(id);

}

function getCity()//获取市
{
thisId = "City";

$("County").length = 0;

var id = $("Province").value;

ajaxCall(id);

}

function getCounty()//获取县城
{
thisId = "County";

var id = $("City").value;

if($("City").length)
{
ajaxCall(id);
}

}

window.onlaod = getProvice();//页面开始载入省

</script>
</head>

<body>
<form action="javascript:void(0)" method="post">
<label for="username" >用户名：</label> <input type="text" name="username" id="username" width="60px" /><br />
<label for="psd" >密  码：</label> <input type="password" name="psd" id="psd" width="80px" /></br>
<label for="psd" >地  址：</label>
<select id="Province" onclick="getCity()">
</select>

<select id="City" onclick="getCounty()" >
</select>

<select id="County" name="xian" >
</select>
<input type="submit" value="提交" />
</form>
</body>
</html>

chuli.php

代码如下:

<?php
//3号线
header("Cache-Control:no-cache");

header("Content-Type: text/xml; charset=gb2312");//这里要写XML

require("function.php");

$id = $_POST['id'];

file_put_contents("my1.txt",$act . "------" . $ziduan);

$result = getresultById($id);

$info = "<mes>";

foreach($result as $row)
{
$info .= "<res>";

$info .= "<id>" . $row['region_id'] . "</id>";

$info .= "<name>" . $row['region_name'] . "</name>";

$info .= "</res>";
}

$info .= "</mes>";

echo $info;

?>

3.数据库函数

function.php


代码如下:

<?php

function getresultById($id)
{
$con = mysql_connect("localhost","root","");

if($con)
{
$charset = "gb2312";
mysql_query("SET character_set_connection=$charset, character_set_results=$charset, character_set_client=binary"); //这句是必须的，解决中文乱码加密问题s
mysql_select_db("ajax",$con);

$sql = "select * from ecs_region where parent_id = '$id'";

$res = mysql_query($sql);
$arr = array();
while($row = mysql_fetch_assoc($res))
{
$arr[] = $row;
}

return $arr;
}
return false;
}

赞 (0)

相关推荐

  • AJAX 网页保留浏览器前进后退等功能

    在一些AJAX被大量使用的页面,有时都不太敢刷新,因为刷新以后可能看到的是和原来有很大不同的页面.暂不讨论在某些页面内容大量更新的情况下是否该使用AJAX的问题,本文简单说一下保留浏览器前进.后退.刷新等功能. 这里假设一个有两个Tabs的页面,每个Tab中含有大量文字,可能还有图片.如果现在觉得Tab2的内容很好,把它加入收藏夹或发送给朋友.下次通过收藏夹打开或者朋友点开这个链接的时候很有可能看到的是Tab1的内容,然后需要鼠标再次点击Tab2才看到想要看的内容.如果页面逻辑更为复杂,则可能要

  • ajax处理服务器返回的三种数据类型方法

    其原理很简单,结构上基本不变,只是改变处理返回数据的方式. 1.Text/HTML格式 这种返回类型处理很简单,直接就当作字符串用就行了.为了方便使用,封装成如下函数: /** * @function 利用ajax动态交换数据(Text/HTML格式) * @param url 要提交请求的页面 * @param jsonData 要提交的数据,利用Json传递 * @param getMsg 这个函数可以获取到处理后的数据 */ function ajaxText(url,jsonData,g

  • AJAX 常用函数创建XMLHTTP对象，区别IE，Mozilla浏览器

    AJAX 常用函数创建XMLHTTP对象,区别IE,Mozilla浏览器的函数,网上有很多创建XMLHTTP对象,区别IE,Mozilla浏览器的函数,这个比较不错,大家可以直接拿用了 复制代码 代码如下: function getRequest() {          http_request = false;          if (window.XMLHttpRequest) {               //对于Mozilla﹑Netscape﹑Safari等浏览器,创建XMLHt

  • Js 代码中,ajax请求地址后加随机数防止浏览器缓存的原因

    看到别人写的JS,ajax请求地址后加随机参数,比如XXXX?t= + new Date().getTime(). 一开始搞不懂为什么,网上查了资料,原因是防止浏览器缓存. 浏览器为了提高用户访问同一页面的速度,会对页面数据进行缓存.当url请求地址不变时, 有时候会导致浏览器不发送请求,直接从缓存中读取之前的数据. 如果数据改变了,而没加随机数,读取的数据会跟之前一样. 加上随机数,就是欺骗浏览器url改变了,会每次都向服务器发送请求而不去读缓存

  • 基于Jquery 解决Ajax请求的页面 浏览器后退前进功能，页面刷新功能实效问题

    需要使用的 jquery.history.js插件 在巨人的肩膀之上,以下前进后退工作基于插件完成! 做了几个兼职,上天帮人完成页面的时候顺便做了一个ajax的请求.发现浏览器的刷新,后退,前进按钮失效.于是乎google了一下.发现了一些解决方法.其中一个jquery.hashchange.js的插件有的时候会失效,有的时候会造成页面多次请求. 换另外一个插件测试下,完美达到我的要求. 总的思路,在url上加上参数,一切工作基于这个参数完成. 复制代码 代码如下: //截取传入字符串中第一次出

  • 用Ajax读取XML格式的数据

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  <html>  <head>  <title>Ajax Hello World</title>  <script type="text/ja

  • JQuery的ajax获取数据后的处理总结(html,xml,json)

    1.html处理比较简单,直接输出即可.一般用$("jb51div").innerHTML等即可 2.json格式数据调用 复制代码 代码如下: $.ajax({ url : "/trundle/RawContentAction.getAjaxContent.act", data : "param1=22", dataType : "json",//这里的dataType就是返回回来的数据格式了html,xml,json ca

  • jquery $.ajax()取xml数据的小问题解决方法

    开始的代码如下: 复制代码 代码如下: $.ajax({ type: "get", url: "Database/App_all.xml", dataType: "xml", timeout: 2000, beforeSend: function () {}, success: function (xml) { $(xml).find("app[id='id-1']").find("auther").app

  • 关于jquery ajax 调用带参数的webservice返回XML数据一个小细节

    后来在一个不起眼的小站找到一个帖子,某个人的一个建议提醒了我. 我原来的代码是这样写的: 错误代码 复制代码 代码如下: $.ajax({ type: "post", url: "_service.asmx/getDataFromATable", data:" { tablename: temp }", dataType: "XML" ... WS是这样写的: webservice 复制代码 代码如下: [WebMethod]

  • Jquery Ajax学习实例 向页面发出请求，返回XML格式数据

    Jquery Ajax学习实例 向页面发出请求，返回XML格式数据

    一.AjaxSample.aspx 处理业务数据,产生XML数据,供JqueryRequest.aspx调用,代码如下: 复制代码 代码如下: protected void Page_Load(object sender, EventArgs e) { string uid = Request.QueryString["username"]; string pwd = Request.QueryString["password"]; Response.Content

随机推荐