Heim  >  Artikel  >  php教程  >  php+jquery+ajax+json的一个最简单实例

php+jquery+ajax+json的一个最简单实例

大家讲道理
大家讲道理Original
2016-11-08 13:54:151060Durchsuche

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:&#39;ab.php&#39;,
             type:&#39;post&#39;,
             dataType:&#39;json&#39;,
             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[&#39;username&#39;];
         $age = $_POST[&#39;age&#39;];
         $job = $_POST[&#39;job&#39;];
         $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 = &#39;ab.php&#39;;
       $.post(url,cont,function(data){
        var res = eval("(" + data + ")");//转为Object对象
       var str = res.username + res.age + res.job;
     $("#result").html(str);
    });
   });  
  });
 </script>
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn