search

Home >php教程 >php手册 >php基于jquery的ajax技术传递json数据简单实例，jqueryjson

php基于jquery的ajax技术传递json数据简单实例，jqueryjson

WBOY
WBOYOriginal
2016-06-13 08:41:381022browse

php基于jquery的ajax技术传递json数据简单实例，jqueryjson

本文实例讲述了php基于jquery的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页面：

<&#63;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;
&#63;>

使用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+ajax技巧与应用小结》、《PHP运算与运算符用法总结》、《PHP网络编程技巧总结》、《PHP基本语法入门教程》、《php操作office文档技巧总结(包括word,excel,access,ppt)》、《php日期与时间用法总结》、《php面向对象程序设计入门教程》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》

希望本文所述对大家PHP程序设计有所帮助。

您可能感兴趣的文章:

  • jQuery通过Ajax向PHP服务端发送请求并返回JSON数据
  • PHP结合Jquery和ajax实现瀑布流特效
  • php+jQuery+Ajax实现点赞效果的方法(附源码下载)
  • jQuery+Ajax+PHP实现“喜欢”评级功能附源码下载
  • jquery与php结合实现AJAX长轮询(LongPoll)
  • jQuery+Ajax+PHP“喜欢”评级功能实现代码
  • jQuery+Ajax+PHP+Mysql实现分页显示数据实例讲解
  • PHP+jQuery+Ajax+Mysql如何实现发表心情功能
  • PHP+jQuery+Ajax实现用户登录与退出
  • PHP+jQuery+Ajax实现多图片上传效果
  • PHP+jquery+ajax实现即时聊天功能实例
  • jquery+php+ajax显示上传进度的多图片上传并生成缩略图代码
  • jQuery+PHP+ajax实现微博加载更多内容列表功能
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：yii2史上最简单式安装教程，没有之一，yii2史最简教程Next article：TCP连接的三次握手和四次解散过程，tcp握手四次解散

Related articles

See more