PHP 与 js的通信(via ajax,json)


Posted in Javascript onNovember 16, 2010

JavaScript端:
注意:一定要设置xmlHttp.setRequestHeader,否则传往PHP的参数会变成null(line 38)
亮点在line 31!

<script type="text/javascript"> 
function GetJson() { 
var xmlHttp; 
try { 
// Firefox, Opera 8.0+, Safari 
xmlHttp = new XMLHttpRequest(); 
} 
catch (e) { 
// Internet Explorer 
try { 
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); 
} 
catch (e) { try { 
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
catch (e) { 
alert("您的浏览器不支持AJAX!"); 
return false; 
} 
} 
} 
xmlHttp.onreadystatechange = function() { 
if (xmlHttp.readyState == 4) { 
//alert(xmlHttp.responseText); 
var str = xmlHttp.responseText; 
document.getElementById('show').innerHTML +=str; 
//alert(str); 
var obj = eval('('+ xmlHttp.responseText +')'); 
//var obj = eval(({"id":"123","name":"elar","age":"21"})); 
alert(obj.name); 
} 
} 
var data = "id=123"; 
xmlHttp.open("POST", "testJson.php", true); 
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 
xmlHttp.send("id=123"); 
} 
</script> 
<input type="button" onclick="GetJson()" value="按我!"/> 
<hr /> 
<div id="show"></div>

PHP端【testJson.php】:
(注意,php文件要干净,<?php ?>标签的外部不能有其他标签,否则eval函数无法解析)
亮点在line 6
<?php 
$res['id'] = $_POST['id']; 
$res['name'] = "elar"; 
$res['age'] = "21"; 
$response = "hello this is response".$_POST['id']; 
echo json_encode($res); 
?>

总结:
js要往PHP端送数据,用的是xmlHttp.send("id=123");
PHP给js送数据,用的是echo json_encode($res);(要注意变量$res的构造应符合JSON的规范)
js要解析PHP送来的JSON格式的数据,用var obj = eval('('+ xmlHttp.responseText +')');
Javascript 相关文章推荐
javascript dom 操作详解 js加强
Jul 13 Javascript
jQuery常见开发技巧详细整理
Jan 02 Javascript
js replace 与replaceall实例用法详解
Aug 03 Javascript
jQuery javaScript捕获回车事件(示例代码)
Nov 07 Javascript
Javascript高级技巧分享
Feb 25 Javascript
Bootstrap每天必学之日期控制
Mar 07 Javascript
jQuery+ajax实现滚动到页面底部自动加载图文列表效果(类似图片懒加载)
Jun 07 Javascript
jQuery实现手机自定义弹出输入框
Jun 13 Javascript
vue以组件或者插件的形式实现throttle或者debounce
May 22 Javascript
微信小程序开发打开另一个小程序的实现方法
May 17 Javascript
在vue中使用Echarts利用watch做动态数据渲染操作
Jul 20 Javascript
JavaScript中window和document用法详解
Jul 28 Javascript
div层的移动及性能优化
Nov 16 #Javascript
自用js开发框架小成 学习js的朋友可以看看
Nov 16 #Javascript
JavaScript.The.Good.Parts阅读笔记(二)作用域&amp;闭包&amp;减缓全局空间污染
Nov 16 #Javascript
JavaScript.The.Good.Parts阅读笔记(一)假值与===运算符
Nov 16 #Javascript
javascript Array对象基础知识小结
Nov 16 #Javascript
纯js实现背景图片切换效果代码
Nov 14 #Javascript
基于jquery的自定义鼠标提示效果 jquery.toolTip
Nov 14 #Javascript
You might like
php实现简单的MVC框架实例
2015/09/23 PHP
关于PHP中Session文件过多的问题及session文件保存位置
2016/03/17 PHP
PHP SFTP实现上传下载功能
2017/07/26 PHP
thinkphp5 URL和路由的功能详解与实例
2017/12/26 PHP
用JavaScript显示随机图像或引用
2009/04/21 Javascript
PPK 谈 JavaScript 的 this 关键字 [翻译]
2009/09/29 Javascript
使用jQuery动态加载js脚本文件的方法
2014/04/03 Javascript
js确认删除对话框适用于a标签及submit
2014/07/10 Javascript
jquery控制页面部分刷新的方法
2015/06/24 Javascript
javascript基本数据类型和转换
2017/03/17 Javascript
解决vue axios的封装 请求状态的错误提示问题
2018/09/25 Javascript
分享一个vue项目“脚手架”项目的实现步骤
2019/05/26 Javascript
JS document对象简单用法完整示例
2020/01/14 Javascript
如何在Vue项目中添加接口监听遮罩
2021/01/25 Vue.js
Python 开发Activex组件方法
2009/11/08 Python
Python中使用摄像头实现简单的延时摄影技术
2015/03/27 Python
使用Python实现从各个子文件夹中复制指定文件的方法
2018/10/25 Python
Python实现RGB与HSI颜色空间的互换方式
2019/11/27 Python
使用pandas的box_plot去除异常值
2019/12/10 Python
windows python3安装Jupyter Notebooks教程
2020/04/13 Python
如何在mac版pycharm选择python版本
2020/07/21 Python
Python在后台自动解压各种压缩文件的实现方法
2020/11/10 Python
Python 微信公众号文章爬取的示例代码
2020/11/30 Python
详解通过focusout事件解决IOS键盘收起时界面不归位的问题
2019/07/18 HTML / CSS
Boolean b = new Boolean(“abcde”); 会编译错误码
2013/11/27 面试题
社会实践自我鉴定
2013/11/07 职场文书
简单的项目建议书模板
2014/03/12 职场文书
委托书的格式
2014/08/01 职场文书
俞敏洪一分钟演讲稿
2014/08/26 职场文书
党的群众路线教育实践活动领导班子整改措施
2014/10/28 职场文书
个人典型事迹材料
2014/12/30 职场文书
高中社区服务活动报告
2015/02/05 职场文书
有关三国演义的读书笔记
2015/06/25 职场文书
创业者如何撰写出一份打动投资人的商业计划书?
2019/07/02 职场文书
创业计划书之健康营养产业
2019/10/15 职场文书
SQL Server远程连接的设置步骤(图文)
2022/03/23 SQL Server