码迷,mamicode.com
首页 > Web开发 > 详细

ThinkPHP以jquery传送json数据格式的方式实现ajax请求

时间:2015-06-29 10:14:48      阅读:142      评论:0      收藏:0      [点我收藏+]

标签:ajax   post   json   eval   

在之前我这里是失败过很多次的,有的时候甚至不得不采用get的传送方式,另外,thinkphp自带的ajax->return方法并不能够解决问题,而且会让问题变得更加复杂,与其不如直接使用jquery的方法,全部采用post提交的方式,get提交是没有任何的问题的,但是post提交问题就一个接一个。我就一直纳闷,为什么在但一脱离框架的页面就能够畅通无阻,这个问题非常的棘手。研究了好长时间终于发现问题所在了,jquery只是前端性的东西基本上和框架扯不上太大的关系,下面是对该问题的总结:
1:
不要有from表单,他可能会自动的提交,不会有ajax的效果。
2:
url格式要正确:如:
var url=”{$smarty.const.SET_URL}index.php/Admin/Test/add”;
3:
json数据格式要正确,不能说算正确,还少我就发现这一种json写法可以实现,但是json有其他的写法,这个非常重要,一定不能写错,如:

var send_data={
                "username" : username
                };

每一行换行都是有道理的!
4:以post的方式接收,如username=_POST[‘username’];
5:返回json数据:这里就不用换行了,因为JavaScript和php的json书写方式还是有一些不同的。
6:客户端接收ajax返回的数据:
返回的是json数据,必须用eval转化为对象的格式才能使用,如 json_data=eval(“(“+data+”)”);
7:就是使用了,这个就是自己的事情了。

下面是一份实例代码:
客户端代码:

<!DOCTYPE HTML>
<html>
    <head>
        <title>测试ajax</title>
        <script type="text/javascript" src="{$smarty.const.JS_URL}jquery.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                $("#sub").click(function(){

                    var username=$("#username").val();
                    var password=$("#password").val();

                    var url="{$smarty.const.SET_URL}index.php/Admin/Test/add";
                    var send_data={
                                       "username" : username
                                    };

                    $(document).load(url,send_data,function(data,status,httprequest){
                        var json_data=eval("("+data+")");
                        $("#get_data").text(json_data.data2);
                    });
                });
            });
        </script>
    </head>
    <body>
        <h1>Ajax测试</h1>
        <!-- <form action="{$smarty.const.__SELF__}" method="post"> -->
            用户名:<input type="text" name="username" id="username"><br>
            密 码:<input type="password" name="password" id="password"><br/>
            <button id="sub">提交测试</button>
            <div id="get_data"></div>
        <!--  </form>-->
    </body>
</html>

服务器的代码:

public function add(){

        $username=$_POST[‘username‘];
        if($username=="xuning"){
            echo "{‘data1‘:‘1111‘,‘data2‘:‘222‘}";
        }else{
            echo "xuning";
        }
    }

ThinkPHP以jquery传送json数据格式的方式实现ajax请求

标签:ajax   post   json   eval   

原文地址:http://blog.csdn.net/mycodedream/article/details/46673609

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!