PHP使用JQUERY通过ajax上传、解析JSON数据

在网上想要找到靠谱的资料真是犹如大海捞针一般困难。

好吧废话不多说，下面贴出可以正确运行的代码。

前提条件：apache已经启动，可以在浏览器地址栏中使用localhost/xxxxx.php访问php文件

<?php
header("Content-Type:text/html;charset=utf-8");
?>
<html>
    <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
    <body>
       
        <form id="myform" method="POST">
            <table >
                <tr>
                    <td id="username"> 用户名：</td><td><input type="text" name="username"/></td>
                </tr>
                 <tr>
                    <td id="realname">真实姓名：</td><td><input type="text" name="realname"/></td>
                </tr>
                 <tr>
                    <td id="id">身份证号码：</td><td><input type="text" name="id"/></td>
                </tr>
                 <tr>
                    <td id="pwd">密码：</td><td><input type="password" name="pwd"/></td>
                </tr>
                 <tr>
                    <td id="confirmpwd"> 确认密码：</td><td><input type="password" name="confirmpwd"/></td>
                </tr>
                 <tr>
                    <td id="Email"> Email:</td><td><input type="text" name="Email"/></td>
                </tr>
                 <tr>
                    <td id="tel"> 电话号码：</td><td><input type="text" name="tel"/></td>
                </tr>
                 <tr>
                    <td id="birthdate">  出生日期：</td><td><input type="text" name="birthdate"/></td>
                </tr>
           
            </table>
             <input id="submitbutton" type="submit" value="提交"/>
        </form>
        
    </body>
<script type="text/javascript">
               
              
            $("#submitbutton").click(function(){
                	 var formdata = $("#myform").serialize();
                	$.ajax({
                            type:'POST',
                            url: 'http://localhost/b.php',
                            dataType: 'json',
                            data: formdata,
                            success: function(json){
                                alert(json.username);
                            },
                            error: function(error) {
                                 alert(error); 
                             }
                         });
                      });
            
          
 </script>
</html>

1.将以上代码放入一个php文件中，如a.php，注意此a.php要求可以在浏览器中地址栏通过localhost/a.php直接访问到

注意其中的$.ajax中的url要进行修改（因为a.php文件中的$.ajax（）中Url为url: 'http://localhost/b.php'），修改为下面这段代码文件所在的路径

<?php
header("Content-Type: application/json; charset=utf-8");


$username=$_POST['username'];
$json = array('username' => $username,'pwd' => 1);
        echo json_encode($json);
?>

2.很明显这段代码是php端返回json数据给前端，把这段代码放入b.php中，注意此b.php要求可以在浏览器中地址栏通过localhost/b.php直接访问到。（因为a.php文件中的$.ajax（）中Url为url: 'http://localhost/b.php'），如果你连这个都还不懂，请先认真研究下php文件安装和访问问题再回来搞ajax

3.在浏览器中输入localhost/a.php,在用户名中输入内容，点击页面中的提交按钮

PHP使用JQUERY通过ajax上传、解析JSON数据

可以看到弹窗 PHP使用JQUERY通过ajax上传、解析JSON数据

说明json返回成功。

4.如果你不懂json数据如何操作，欢迎关注我的其他文章“php下json数据详解”

PHP使用JQUERY通过ajax上传、解析JSON数据

相关推荐