php+ajax+json 详解及实例代码


Posted in PHP onDecember 12, 2016

php+ajax+json 实例代码

html页面:

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
 $(function(){
   $("#send").click(function(){
    var cont = $("input").serialize();
    $.ajax({
      url:'ab.php',
      type:'post',
      dataType:'json',
      data:cont,
      success:function(data){
       var str = data.username + data.age + data.job;
       $("#result").html(str);
    }
  });
 }); 
 });
</script>
</head>
<body>
<div id="result">一会看显示结果</div>
<form id="my" action="" method="post">
      <p><span>姓名:</span> <input type="text" name="username" /></p>
     <p><span>年龄:</span><input type="text" name="age" /></p>
     <p><span>工作:</span><input type="text" name="job" /></p>
</form>
<button id="send">提交</button>
</body>
</html>

 php页面:

<?php
header("Content-type:text/html;charset=utf-8");
    $username = $_POST['username'];
    $age = $_POST['age'];
    $job = $_POST['job'];
    $json_arr = array("username"=>$username,"age"=>$age,"job"=>$job);
    $json_obj = json_encode($json_arr);
    echo $json_obj;
?>

使用post方式

<script type="text/javascript">
 $(function(){
 $("#send").click(function(){
   var cont = {username:$("input")[0].value,age:$("input")[1].value,job:$("input")[2].value};
   var url = 'ab.php';
   $.post(url,cont,function(data){
    var res = eval("(" + data + ")");//转为Object对象
   var str = res.username + res.age + res.job;
  $("#result").html(str);
  });
 }); 
 });
</script>

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

PHP 相关文章推荐
汉字转化为拼音(php版)
Oct 09 PHP
apache rewrite_module模块使用教程
Jan 10 PHP
功能齐全的PHP发送邮件类代码附详细说明
Jul 10 PHP
PHP中static关键字原理的学习研究分析
Jul 18 PHP
php使用递归计算文件夹大小
Dec 24 PHP
php从数据库查询结果生成树形列表的方法
Apr 17 PHP
百度工程师讲PHP函数的实现原理及性能分析(一)
May 13 PHP
php中header设置常见文件类型的content-type
Jun 23 PHP
详解PHP的Yii框架中组件行为的属性注入和方法注入
Mar 18 PHP
php die()与exit()的区别实例详解
Dec 03 PHP
PHP全功能无变形图片裁剪操作类与用法示例
Jan 10 PHP
PHP读取Excel类文件
May 15 PHP
解决微信授权回调页面域名只能设置一个的问题
Dec 11 #PHP
Zend Framework数据库操作方法实例总结
Dec 11 #PHP
smarty模板数学运算示例
Dec 11 #PHP
Zend Framework入门应用实例详解
Dec 11 #PHP
Zend Framework前端控制器用法示例
Dec 11 #PHP
Zend Framework路由器用法实例详解
Dec 11 #PHP
Zend Framework分发器用法示例
Dec 11 #PHP
You might like
php+mysql分页代码详解
2008/03/27 PHP
解析PHP对现有搜索引擎的调用
2013/06/25 PHP
PHP调试函数和日志记录函数分享
2015/01/31 PHP
解决nginx不支持thinkphp中pathinfo的问题
2015/07/21 PHP
PHP获取二维数组中某一列的值集合
2015/12/25 PHP
IE6,IE7下js动态加载图片不显示错误
2010/07/17 Javascript
用方法封装javascript的new操作符(一)
2010/12/25 Javascript
JQ获取动态加载的图片大小的正确方法分享
2013/11/08 Javascript
改变隐藏的input中value值的方法
2014/03/19 Javascript
JavaScript设计模式之工厂方法模式介绍
2014/12/28 Javascript
JS实现新浪博客左侧的Blog管理菜单效果代码
2015/10/22 Javascript
JavaScript 闭包详细介绍
2016/09/28 Javascript
jQ处理xml文件和xml字符串的方法(详解)
2016/11/22 Javascript
JQuery学习总结【一】
2016/12/01 Javascript
JS回调函数基本定义与用法实例分析
2017/05/24 Javascript
vue使用Axios做ajax请求详解
2017/06/07 Javascript
JavaScript脚本语言是什么_动力节点Java学院整理
2017/06/26 Javascript
js+canvas实现验证码功能
2020/09/21 Javascript
Vue-component全局注册实例
2018/09/06 Javascript
QRCode.js二维码生成并能长按识别
2018/10/16 Javascript
详解如何创建并发布一个 vue 组件
2018/11/08 Javascript
js实现百度淘宝搜索功能
2020/02/17 Javascript
vue中解决chrome浏览器自动播放音频和MP3语音打包到线上的实现方法
2020/10/09 Javascript
python自动化工具日志查询分析脚本代码实现
2013/11/26 Python
Python的SQLAlchemy框架使用入门
2015/04/29 Python
快速解决PyCharm无法引用matplotlib的问题
2018/05/24 Python
如何基于Python实现数字类型转换
2020/02/07 Python
Python文件夹批处理操作代码实例
2020/07/21 Python
优秀学生自我鉴定范例
2013/12/18 职场文书
丧事主持词大全
2014/04/02 职场文书
新品发布会主持词
2014/04/02 职场文书
群众路线领导干部个人对照检查材料(集锦)
2014/09/23 职场文书
处级领导班子全部召开专题民主生活会情况汇报
2014/09/27 职场文书
幼儿园校园小喇叭广播稿
2014/10/17 职场文书
《岳阳楼记》原文、译文赏析
2019/09/10 职场文书
2022微信温控新功能上线
2022/05/09 数码科技