jQuery通过Ajax向PHP服务端发送请求并返回JSON数据

最新推荐文章于 2021-08-06 14:30:48 发布

又起风了

最新推荐文章于 2021-08-06 14:30:48 发布

阅读量2.2k

点赞数

分类专栏： jquery 文章标签： ajax json jquery

jquery 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

首先需要详看：
http://blog.csdn.net/sunchengwei/article/details/6675537
http://www.helloweba.com/view-blog-79.html
所示的内容，写的很好，
这里只是检测了一下，
test.html

<!DOCTYPE>
<html  style="width:100%;height:100%;margin:0;">
    <head>
    <meta charset="utf-8">
        <title>Ajax</title>
<style>   
#userlist{margin:4px; height:42px} 
#userlist li{float:left; width:80px; line-height:42px; height:42px; font-size:14px;  
font-weight:bold} 
#info{clear:left; padding:6px; border:1px solid #b6d6e6; background:#e8f5fe} 
#info p{line-height:24px} 
#info p span{font-weight:bold} 
</style>   
<script type="text/javascript" src="./jquery/1.8.2/jquery.js"></script> 
<script>
    $(function(){ 
    $("#userlist a").bind("click",function(){ 
        var hol = $(this).attr("rel"); 
        var data = "action=getlink&id="+hol; 

        $.getJSON("test.php",data, function(json){  
            $("#name").html(json.name); 
            $("#sex").html(json.sex); 
            $("#tel").html(json.tel); 
            $("#email").html(json.email); 
       });  
    }); 
}); 
</script>
</head>   
 <body>
<ul id="userlist"> 
   <li><a href="#" rel="1">张三</a></li> 
   <li><a href="#" rel="2">李四</a></li> 
   <li><a href="#" rel="3">王五</a></li> 
</ul> 
<div id="info"> 
   <p>姓名：<span id="name"></span></p> 
   <p>性别：<span id="sex"></span></p> 
   <p>电话：<span id="tel"></span></p> 
   <p>邮箱：<span id="email"></span></p> 
</div> 
</body>
</html>

test.php文件

<?php
header("content-type:text/html;charset=utf-8");
@mysql_connect("localhost",'root','123456');
mysql_select_db('test') or die(mysql_error());
mysql_set_charset("utf8");
$action=@$_GET['action']; 
$id=intval($_GET['id']); 
if($action=="getlink"){
$sql="select * from user where id='$id'"; 
    $query=mysql_query($sql) or die(mysql_error()); 
 /*
   //多条数据  前台的name的访问：json[0].name

   $sql="select * from user";
   $list=[];
    while($row=mysql_fetch_assoc($query)){
     $list[]=array("name"=>$row['username'],"sex"=>$row['sex'],"tel"=>$row['tel'],"email"=>$row['email']); 
    } 
    $a=json_encode($list);
    echo json_encode($list); 
    //可以选择直接写入文件，也可以选择直接返回数据(常用)
    $myfile=fopen("data.php",'w');
    fwrite($myfile,$a);
    fclose($myfile);
    */
    $row=mysql_fetch_assoc($query);
    $list=array("name"=>$row['username'],"sex"=>$row['sex'],"tel"=>$row['tel'],"email"=>$row['email']); 
    echo json_encode($list); 
    //将数据保存在文件中

}

创建表和数据库

create database test;
use test;
CREATE TABLE IF NOT EXISTS `user` ( 
  `id` int(11) NOT NULL auto_increment, 
  `username` varchar(100) NOT NULL, 
  `sex` varchar(6) NOT NULL, 
  `tel` varchar(50) NOT NULL, 
  `email` varchar(64) NOT NULL, 
  PRIMARY KEY  (`id`) 
) ENGINE=MyISAM DEFAULT CHARSET=utf8; 
INSERT INTO `user` (`id`, `username`, `sex`, `tel`, `email`) VALUES
(1, '张三', '男', '15690697321', '2074992572@qq.com'),
(2, '李四', '男', '15690697322', '20749925224@qq.com'),
(3, '王五', '男', '15690697323', '2074992573@qq.com');

个人觉得$.getJSON()用于显示多个或单个的前台数据，比如oj的题目显示结合多个(html)文件创建，$.post()等应该是在发送电子邮件方面

又起风了

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery通过Ajax向PHP服务端发送请求并返回JSON数据

首先需要详看： http://blog.csdn.net/sunchengwei/article/details/6675537 http://www.helloweba.com/view-blog-79.html 所示的内容，写的很好，这里只是检测了一下， test.html<!DOCTYPE><html style="width:100%;height:100%;margin:0
复制链接

扫一扫