zoukankan      html  css  js  c++  java
  • 弹窗显示详情练习

    <!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="popwindow/tanchuang.js"></script>
    
    <?php
    include("../DBDA.php");
    $db = new DBDA();
    ?>
    <link href="popwindow/tanchuang.css" rel="stylesheet" type="text/css" />
    </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='btn' code='{$v[0]}' /></td>
        </tr>";
    	}
    	?>
    </table>
    
    </body>
    <script type="text/javascript">
    $(document).ready(function(e) {
        
    	$(".btn").click(function(){
    		
    		//找主键值
    		var code = $(this).attr("code");
    		
    		//根据主键查询具体数据
    		$.ajax({
    			url:"xqchuli.php",
    			data:{code:code},
    			type:"POST",
    			dataType:"TEXT",
    			success: function(data){
    					//拆出数据
    					var lie = data.split("^");
    					
    					var html = "<div class='xq'>代号:"+lie[0]+"</div><div class='xq'>名称:"+lie[1]+"</div><div class='xq'>系列:"+lie[2]+"</div><div class='xq'>上市时间:"+lie[3]+"</div><div class='xq'>油耗:"+lie[4]+"</div><div class='xq'>功率:"+lie[5]+"</div><div class='xq'>排量:"+lie[6]+"</div><div class='xq'>价格:"+lie[7]+"</div>";
    					
    					var win = new Window({
    					
    					width : 300, //宽度
    					height : 400, //高度
    					title : '汽车详情信息', //标题
    					content : html, //内容
    					isMask : true, //是否遮罩
    					//buttons : button, //按钮
    					isDrag:true,//是否移动
    					
    					});
    				
    				}
    			
    			});
    		
    	})
    	
    });
    </script>
    </html>
    

      处理页面

    <?php
    $code = $_POST["code"];
    
    include("../DBDA.php");
    $db = new DBDA();
    
    $sql = "select * from car where code = '{$code}'";
    
    $attr = $db->Query($sql);
    
    echo implode("^",$attr[0]);
    

      

  • 相关阅读:
    php学习----文件系统
    zabbix添加mysql自定义监控项
    mysql主从库不同步问题
    zabbix分区
    CentOs7.3 安装 MySQL 5.7.21 二进制版本及主从配置
    MySQL数据备份之mysqldump使用
    mysql 占用大量写I/O
    zabbix添加企业微信发送
    Centos7 更新软件及删除多余内核
    zabbix监控vCenter报错
  • 原文地址:https://www.cnblogs.com/hamilton/p/5618630.html
Copyright © 2011-2022 走看看