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

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

<head>

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

<title>无标题文档</title>

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

<script src="tanchuang.js"></script>

<link href="tanchuang.css" rel="stylesheet" type="text/css" />

<?php

include("dbda.class.php");

$db=new dbda();

?>

</head>

<body>

<table width="100%" border="1" cellpadding="0" cellspacing="0">

    <tr>

        <td>汽车名称</td>

        <td>汽车系列</td>

        <td>上市时间</td>

        <td>信息</td>

    </tr>

    <?php

    $sql="select * from car";

    $attr=$db->Query($sql);

    foreach($attr as $v)

    {

        echo "<tr>

            <td>{$v[1]}</td>

            <td>{$v[2]}</td>

            <td>{$v[3]}</td>

            <td><input type='button' value='查看详情' class='aaa'

            code='{$v[0]}' /></td>

            </tr>";

    }

    ?>

</table>

</body>

<script type="text/javascript">

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

    $(".aaa").click(function(){

        //找主键值

        var code=$(this).attr("code");

        //根据主键查询具体数据

        $.ajax({

            url:"AJAXlianxichuli.php",

            data:{code:code},

            type:"POST",

            dataType:"TEXT",

            success: function(data){

                var lie=data.split("^");

                var html = "<div class='qx'>代号："+lie[0]

                +"</div><div class='qx'>名称："+lie[1]

                +"</div><div class='qx'>系列："+lie[2]

                +"</div><div class='qx'>时间："+lie[3]

                +"</div><div class='qx'>油耗："+lie[4]

                +"</div><div class='qx'>功率："+lie[5]

                +"</div><div class='qx'>排量："+lie[6]

                +"</div><div class='qx'>价格："+lie[7]+"</div>";

                var win = new Window({

                width : 300, //宽度

                height : 400, //高度

                title : '详细信息', //标题

                content : html, //内容

                isMask : true, //是否遮罩

                isDrag:true, //是否移动

                });

                }

            });

        })

});

</script>

</html>
<?php

$code=$_POST["code"];

include("dbda.class.php");

$db=new dbda();

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

$attr=$db->Query($sql);

//$attr[0]代表一列，是一维数组   然后用implode分割变成字符串

echo implode("^",$attr[0]);

AJAX 汽车详细信息练习的更多相关文章

  1. ajax 实现加载页面、删除、查看详细信息，以及bootstrap网页的美化

      由于有些的程序员可能不是很会Photoshop,所以为了美化页面,我们可以借助工具bootstrap,实现起来相对就要比之前做的美观一些, 今天我用bootstrap把之前做的显示表格进行了一下美 ...

  2. 11月10日下午 ajax做显示信息以后用ajax、Bootstrp做弹窗显示信息详情

    1.用ajax做弹窗显示信息详情 nation.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...

  3. Atitit.dwr3 不能显示错误详细信息的解决方案,控件显示错误详细信息的解决方案 java .net php

    Atitit.dwr3 不能显示错误详细信息的解决方案,控件显示错误详细信息的解决方案 java .net php 1. Keyword/subtitle 1 2. 使用dwr3的异常convert处 ...

  4. struts2：上传多个文件时实现带进度条、进度详细信息的示范

    上一篇文章讲了上传单个文件与上传多个文件(属性驱动)的例子.本例是上传多个文件(属性驱动),并且显示进度条.进度详细信息的示范. 在文件上传选择界面,允许用户增加.删除选择的文件,且只能上传指定类型的 ...

  5. JQuery中的AJAX参数详细介绍

    Jquery中AJAX参数详细介绍 参数名 类型 描述 url String    (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方 ...

  6. 转载 Jquery中AJAX参数详细介绍

    Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ...

  7. ThinkPHP页面跳转、Ajax技巧详细介绍（十八）

    原文:ThinkPHP页面跳转.Ajax技巧详细介绍(十八) ThinkPHP页面跳转.Ajax技巧详细介绍 一.页面跳转 $this->success('查询成功',U('User/test' ...

  8. 利用Scrapy爬取所有知乎用户详细信息并存至MongoDB

    欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 作者 :崔庆才 本节分享一下爬取知乎用户所有用户信息的 Scrapy 爬虫实战. 本节目标 本节要实现的内容有 ...

  9. Asp.Net MVC 中JS通过ajaxfileupload上传图片获取身份证姓名、生日、家庭住址等详细信息

    客户要求用身份证图片上传获取身份证的详细信息就下来研究了一下(现在的客户真的懒 身份证信息都懒得输入了哈哈...),经过慢慢研究,果然皇天不负有心人搞出来了.这个借助的是腾讯的一个SKD  腾讯优图云 ...

随机推荐

  1. Linux搭建一个FTP服务器

    1.安装vsftp 2.配置vsftpd.conf, vim /etc/vsftpd.conf 下面说说里面比较重要的选项 1 anonymous_enable=NO #不允许匿名用户 2 3 loc ...

  2. JavaScript深入浅出2-表达式和运算符

    慕课网教程视频地址:Javascript深入浅出 表达式是指能计算出值的任何可用程序单元 原始表达式:常量.直接量 3.14,“test” 关键字 null,this 变量 i,k,j 表达式含:原始 ...

  3. ZUI前段框架简介

    一.说明 基于Bootstrap定制 ZUI继承了Bootstrap 3中的大部分基础内容,但出于与Bootstrap不同的目的,一些组件都进行了定制和修改.这些变化包括: 移除了部分插件的限制,增加 ...

  4. Codeforces Gym 101138 G. LCM-er

    Description 在 \([a,b]\) 之间选择 \(n\) 个数 (可以重复) ,使这 \(n\) 个数的最小公倍数能被 \(x\) 整除,对 \(10^9+7\) 取膜. \(1\leqs ...

  5. Java获取新浪微博cookies

    import java.io.BufferedReader; import java.io.File; import java.io.FileInputStream; import java.io.F ...

  6. 【云计算】Cloudify-基于TOSCA规范的开源云应用编排系统

      .cloudify-manager-blueprints:https://github.com/cloudify-cosmo/cloudify-manager-blueprints/tree/3. ...

  7. struts2 模型驱动

    public class User3Action extends ActionSupport implements ModelDriven<User> { private User use ...

  8. ios 多线程必读内容 ：锁

    大学时的生产者消费者问题还记得吗?ios中的锁,请阅读以下官方文档,虽然是英文的,但是说的非常准确: Threading Programming Guide 中的 Synchronization ht ...

  9. Java对象排序

    java实现对象比较,可以实现java.lang.Comparable或java.util.Comparator接口 //Product.java import java.util.Date; //p ...

  10. ajax与后台交互传输数据的工具类

    public class Result<T> implements Serializable { private static final long serialVersionUID = ...