您当前的位置： 首页 > 学无止境 > JS经典实例 网站首页JS经典实例
php与ajax-json数据的获取,字符串转换json教程
发布时间：2015-04-19 21:44:53编辑：雪饮阅读（）
json数据获取的前端源代码(index2-post.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=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function xmlhttprequestobject(){
//一号线创建ajax对象
var xmlhttprequest='';
if(window.ActiveXObject){
xmlhttprequest=new ActiveXObject("Microsoft.XMLHTTP");
}
else{
xmlhttprequest=new XMLHttpRequest();
}
return xmlhttprequest;
}
//上面的方法创建了xmlhttprequest对象
function getid(id){
return document.getElementById(id)
}
//预置一个全局空对象
var myxmlhttpquestobject="";
function checkname(){
myxmlhttpquestobject=xmlhttprequestobject();
if(myxmlhttpquestobject){
//如果ajax对象创建成功，我们就打开该对象的传输协议准备传输
//声明ajax要传递参数以及要接收参数的文件路径
var url="chuli-post.php";
//二号线，用指定的url以get的方式打开请求，并且开启异步
var data="yhm="+getid("username").value;
myxmlhttpquestobject.open("post",url,true);
//三号线，用回调函数来处理服务器端返回信息
myxmlhttpquestobject.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=gb2312");
myxmlhttpquestobject.onreadystatechange=huidiaohanshu
//get方式的请求发送，在send（）方法中直接填入null即可，若是post方式则需要填入具体值
myxmlhttpquestobject.send(data);
}
else{
alert("创建对象失败");
}
}
function huidiaohanshu(){
//ie中状态码是4次，而360这种webkit内核的则是3次
//alert("处理函数被调用:"+myxmlhttpquestobject.readyState);
if(myxmlhttpquestobject.readyState==4){
var mes=myxmlhttpquestobject.responseText;
//alert(mes);//弹出取出的json数据，仅仅只是字符串罢了
var mes_obj=eval("("+mes+")");//将字符串转换为json对象
//alert(typeof mes_obj);//输出给变量的类型，是json对象没有错
//alert(mes_obj.res);//既是对象，那么我们可以直接以对象的方式访问其属性
//alert(mes_obj.blogname);
getid("tishi").innerHTML=mes_obj.res;
}
}
</script>
</head>
<body>
<h1>表单1</h1>
<form id="bd1">
用户名：<input type="text" id="username" onkeyup="checkname();"><div id="tishi"></div><br/>
密码：<input type="text" id="password"><br/>
<input type="button" value="提交" onclick="checkname();">
</form>
<br/>
<h1>表单2</h1>
<form id="bd2">
用户名：<input type="text" id="username2"><br/>
密码：<input type="text" id="password2">
</form>
</body>
</html>
关键字词：json,json教程,个人博客