返回值是JSON的阿贾克斯方法

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 2 <html xmlns="http://www.w3.org/1999/xhtml">

 3 <head>

 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  

 5 <title>返回值是JSON的阿贾克斯方法</title>

 6 <script src="../jquery-1.11.2.min.js"></script>

 7 </head>

 8

 9 <body>

10 <div>

11 请输入代号:<input type="text" id="code" />

12 <input type="button" value="查询" id="btn" />

13 </div>

14 <div id="name"></div>

15 </body>

16 <script type="text/javascript">

17 $(document).ready(function(e) {

18     $("#btn").click(function(){//给查询按钮加入点击事件

19         var code = $("#code").val();//取到用户输入的值并存放

20         $.ajax({

21             url:"selchuli.php",

22             data:{code:code},

23             type:"POST",

24             dataType:"json",

25             success: function(data){

26                 $("#name").text(data.name);//把查到的数据放入到ID是name的区域内

27                 }

28             });

29         })

30 });

31

32 </script>

33 </html>

处理页面的代码:

 1 <?php

 2 $code = $_POST["code"];

 3 $db = new MySQLi("localhost","root","","aaaaa");

 4 $sql = "select name from car where code = '{$code}'";

 5 $r = $db->Query($sql);

 6 $attr = $r->fetch_all();

 7 //做一个关联数组

 8 $arr = array();//创建一个空数组

 9 $arr["name"] = $attr[0][0];

10 //在$arr索引为name的位置放入一条数据,$attr[0][0]就是name的值

11

12 echo json_encode($arr);//调用JSON方法,将数组转换为JSON数据

13 //注意!在把数组转换成JSON的时候最好是关联数组

复制代码

输入型号代码,点击查询,在下方DIV中显示相应的name名

posted @ 2016-06-30 08:05  天翊丨流光  阅读(215)  评论(0编辑  收藏  举报