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

发布时间：2022-07-15 13:01:38 所属栏目：PHP教程来源：互联网

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

　　这篇文章主要介绍了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>

（编辑：鞍山站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!