AJAX 汽车详细信息练习

<!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]);

时间: 2024-10-18 13:00:16

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

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

  由于有些的程序员可能不是很会Photoshop,所以为了美化页面,我们可以借助工具bootstrap,实现起来相对就要比之前做的美观一些, 今天我用bootstrap把之前做的显示表格进行了一下美化,同时也把ajax部分进行了优化,看起来会更清晰   我没有下载bootstrap的包,直接从网页引用的 1 <script src="jquery-3.1.1.min.js"></script> 2 <link rel="stylesheet&q

PHP-----作业题:显示详细信息

显示详细信息(详细信息按钮点击(AJAX) 显示 弹窗) 封装类代码: 1 <?php 2 class DBDA 3 { 4 public $host="localhost";//服务器地址 5 public $uid="root";//用户名 6 public $pwd="";//密码 7 8 public $conn;//连接对象 9 //操作数据库的方法 10 //$sql代表需要执行的SQL语句 11 //$type代表SQL语句的

Ext属性详细信息

Ext.window属性详细信息 Ext.Window扩展自Ext.Panel,其xtype值为window. 1.主要配置项 closable:是否允许关闭窗口,默认为true.       closeAction:关闭窗口的动作,包括以下两种:        close:从DOM删除窗口,销毁窗口及其所属组件,窗口不再可用,重新显示需要调   用show方法.此为默认值.        hide:通过设置可见性隐藏窗口,窗口还可用,调用show方法后重新显示.       constrain

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

Atitit.dwr3 不能显示错误详细信息的解决方案,控件显示错误详细信息的解决方案 java .net php 1. Keyword/subtitle 1 2. 使用dwr3的异常convert处理不能解除,,,按照盗垒能解除了.... 1 3. 使用js 回回调功能处理...还是不能,子能显示个..javaClassName:"java.lang.Throwable",message:"Error"} 2 4. 异常转换器 2 5. 当然如果想要只针对某一个f

Jquery中AJAX参数详细(1)-转

http://www.cnblogs.com/qiufuwu618/archive/2012/12/20/2826190.html Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET".注意:其它 HTTP 请求方法,如 PUT 和 DELETE

ajax做显示信息以后用ajax、Bootstrp做弹窗显示信息详情

nation.php 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-e

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

欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 作者 :崔庆才 本节分享一下爬取知乎用户所有用户信息的 Scrapy 爬虫实战. 本节目标 本节要实现的内容有: 从一个大V用户开始,通过递归抓取粉丝列表和关注列表,实现知乎所有用户的详细信息的抓取. 将抓取到的结果存储到 MongoDB,并进行去重操作. 思路分析 我们都知道每个人都有关注列表和粉丝列表,尤其对于大V来说,粉丝和关注尤其更多. 如果我们从一个大V开始,首先可以获取他的个人信息,然后我们获取

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

1.用ajax做弹窗显示信息详情 nation.php <!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> <me

ThinkPHP页面跳转、Ajax技巧详细介绍(十八)

原文:ThinkPHP页面跳转.Ajax技巧详细介绍(十八) ThinkPHP页面跳转.Ajax技巧详细介绍 一.页面跳转 $this->success('查询成功',U('User/test')); ├─//跳当前模块方法下: ├─ $this->success('查询成功','test'); └─//跳到 指定跳转模块方法下 this->success('查询成功',U('User/test')); $this->error('查询失败,3秒后跳会之前的页面/上一页'); //