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

 更新时间:2021年9月22日 10:16  点击:1668

注意点:

 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" >密 &nbsp;码:</label> <input type="password" name="psd" id="psd" width="80px" /></br>
<label for="psd" >地 &nbsp;址:</label>
<select id="Province" onclick="getCity()">
</select>&nbsp;

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

<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;
}

[!--infotagslink--]

相关文章

  • gin 获取post请求的json body操作

    这篇文章主要介绍了gin 获取post请求的json body操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-03-15
  • C#使用Http Post方式传递Json数据字符串调用Web Service

    这篇文章主要为大家详细介绍了C#使用Http Post方式传递Json数据字符串调用Web Service,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
  • C#模拟http 发送post或get请求的简单实例

    下面小编就为大家带来一篇C#模拟http 发送post或get请求的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2020-06-25
  • vue.js 表格分页ajax 异步加载数据

    Vue.js通过简洁的API提供高效的数据绑定和灵活的组件系统.这篇文章主要介绍了vue.js 表格分页ajax 异步加载数据的相关资料,需要的朋友可以参考下...2016-10-20
  • 解决Mybatis中mapper.xml文件update,delete及insert返回值问题

    这篇文章主要介绍了解决Mybatis中mapper.xml文件update,delete及insert返回值问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2020-11-23
  • 解决HttpPost+json请求---服务器中文乱码及其他问题

    这篇文章主要介绍了解决HttpPost+json请求---服务器中文乱码及其他问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2021-01-22
  • C#使用post发送和接收数据的方法

    这篇文章主要介绍了C#使用post发送和接收数据的方法,涉及C#使用post收发数据的相关技巧,非常具有实用价值,需要的朋友可以参考下...2020-06-25
  • JS基于MSClass和setInterval实现ajax定时采集信息并滚动显示的方法

    这篇文章主要介绍了JS基于MSClass和setInterval实现ajax定时采集信息并滚动显示的方法,涉及JavaScript页面元素定时滚动操作及ajax调用实现技巧,需要的朋友可以参考下...2016-04-19
  • Angular利用HTTP POST下载流文件的步骤记录

    这篇文章主要给大家介绍了关于Angular利用HTTP POST下载流文件的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者使用Angular具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧...2020-07-26
  • C#从数据库读取数据到DataSet并保存到xml文件的方法

    这篇文章主要介绍了C#从数据库读取数据到DataSet并保存到xml文件的方法,涉及C#操作DataSet保存到XML文件的技巧,需要的朋友可以参考下...2020-06-25
  • jQuery+ajax简单实现文件上传的方法

    这篇文章主要介绍了jQuery+ajax简单实现文件上传的方法,结合实例形式简单分析了jQuery基于ajax的post方法进行文件传输及asp.net后台处理技巧,需要的朋友可以参考下...2016-06-12
  • XML、HTML、CSS与JS的区别整理

    在BS中,xml,html,css和js我们都学过,起初分不清这四者的区别和联系,随着知识的增长,有了一些体会,下面通过本文给大家简单介绍 XML、HTML、CSS与JS的区别,需要的朋友参考下...2016-02-21
  • jquery Ajax实现Select动态添加数据

    这篇文章主要为大家详细介绍了jquery Ajax实现Select动态添加数据的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2017-06-15
  • js实现ajax的用户简单登入功能

    这篇文章主要为大家详细介绍了js实现ajax的用户简单登入功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-19
  • js操作XML文件的实现方法兼容IE与FireFox

    下面小编就为大家带来一篇js操作XML文件的实现方法兼容IE与FireFox。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2016-07-01
  • PHP+jQuery+Ajax实现多图片上传效果

    今天我给大家分享的是在不刷新页面的前提下,使用PHP+jQuery+Ajax实现多图片上传的效果。用户只需要点击选择要上传的图片,然后图片自动上传到服务器上并展示在页面上。...2015-03-15
  • jQuery UI结合Ajax创建可定制的Web界面

    这篇文章主要为大家详细介绍了jQuery UI结合Ajax创建可定制的Web界面,如何利用Ajax和jQuery UI创建具有各种定制功能的高度可定制的UI,感兴趣的小伙伴们可以参考一下...2016-06-24
  • JS跨浏览器解析XML应用过程详解

    这篇文章主要介绍了JS跨浏览器解析XML应用过程详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2020-10-16
  • Xml中使用foreach遍历对象实现代码

    这篇文章主要介绍了Xml中使用foreach遍历对象实现代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下...2020-12-04
  • jquery+Ajax实现简单分页条效果

    这篇文章主要为大家详细介绍了jquery+Ajax实现简单分页条效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2021-06-17