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
PHP 常见郁闷问题答解
Nov 25 PHP
ob_start(),ob_start('ob_gzhandler')使用
Dec 25 PHP
用js进行url编码后用php反解以及用php实现js的escape功能函数总结
Feb 08 PHP
写php分页时出现的Fatal error的解决方法
Apr 18 PHP
PHP批量删除、清除UTF-8文件BOM头的代码实例
Apr 14 PHP
php使用pdo连接报错Connection failed SQLSTATE的解决方法
Dec 15 PHP
php实现格式化多行文本为Js可用格式
Apr 15 PHP
php检查函数必传参数是否存在的实例详解
Aug 28 PHP
PHP保留两位小数的几种方法
Jul 24 PHP
laravel 5.5 关闭token的3种实现方式
Oct 24 PHP
PHPstorm启用自动换行的方法详解(IDE)
Sep 17 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抽象工厂模式(Elgg)
2010/03/21 PHP
PHP中$_SERVER使用说明
2015/07/05 PHP
PHP基于DOMDocument解析和生成xml的方法分析
2017/07/17 PHP
IE6下拉框图层问题探讨及解决
2014/01/03 Javascript
form.submit()不能提交表单的错误原因及解决方法
2014/10/13 Javascript
jQuery获取样式中颜色值的方法
2015/01/29 Javascript
简单实现轮播图效果的实例
2016/07/15 Javascript
javascript代码调试之console.log 用法图文详解
2016/09/30 Javascript
AngularJS实现在ng-Options加上index的解决方法
2016/11/03 Javascript
JavaScript触发onScroll事件的函数节流详解
2016/12/14 Javascript
原生js实现可爱糖果数字时间特效
2016/12/30 Javascript
详解Vue 2.0封装axios笔记
2017/06/22 Javascript
vue基于Element构建自定义树的示例代码
2017/09/19 Javascript
详解weex默认webpack.config.js改造
2018/01/08 Javascript
vue 项目常用加载器及配置详解
2018/01/22 Javascript
微信小程序6位或多位验证码密码输入框功能的实现代码
2018/05/29 Javascript
微信小程序判断用户是否需要再次授权获取个人信息
2019/07/18 Javascript
vue实现输入一位数字转汉字功能
2019/12/13 Javascript
用Python写脚本,实现完全备份和增量备份的示例
2018/04/29 Python
pytorch + visdom CNN处理自建图片数据集的方法
2018/06/04 Python
用Python分析3天破10亿的《我不是药神》到底神在哪?
2018/07/12 Python
windows下python 3.6.4安装配置图文教程
2018/08/21 Python
python 的 openpyxl模块 读取 Excel文件的方法
2019/09/09 Python
python 实现按对象传值
2019/12/26 Python
CSS3的 fit-content实现水平居中
2017/09/07 HTML / CSS
CSS实现雨滴动画效果的实例代码
2019/10/08 HTML / CSS
购买中国最好的电子产品:Geekbuying
2018/03/13 全球购物
高一历史教学反思
2014/01/13 职场文书
大学运动会入场词
2014/02/22 职场文书
作文评语大全
2014/04/23 职场文书
基层党员公开承诺书
2014/05/29 职场文书
个人合伙协议书范本
2014/10/14 职场文书
2014年心理健康教育工作总结
2014/12/06 职场文书
安全承诺书
2015/01/19 职场文书
2015年度合同管理工作总结
2015/05/22 职场文书
公安忠诚教育心得体会
2016/01/23 职场文书