当前位置：首页 > PHP教程 > php应用 > 列表

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

发布:smiling　来源: PHP粉丝网　添加日期：2021-07-28 17:26:39　浏览: 评论：0　

这篇文章主要介绍了php基于jquery的ajax技术传递json数据方法,以完整实例形式分析了PHP基于jQuery的ajax无刷新提交数据实现方法,非常简单易懂,需要的朋友可以参考下。

本文实例讲述了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页面：

<?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>