ajax练习习题一弹窗查看

最新推荐文章于 2021-08-06 19:47:38 发布

weixin_30606669

最新推荐文章于 2021-08-06 19:47:38 发布

阅读量127

点赞数

文章标签： php xhtml javascript ViewUI

原文链接：http://www.cnblogs.com/zoubizhici/p/5614375.html

版权

显示页面

<!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 type="text/javascript" src="../../popwindow/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="../../popwindow/tanchuang.js"></script>
<link href="../../popwindow/tanchuang.css" rel="stylesheet" type="text/css" />
</head>

<body>

<table border=1px>
 <tr>
 <td>车名</td>
 <td>上市时间</td>
 <td>油耗</td>
 <td>查看</td>
 <?php
  $dbn="mysql:host=localhost;dbname=1";
  $db=new PDO($dbn,"root","");
  $sql="select * from car";
  $result=$db->query($sql);
  $attr=$result->fetchALL();
  foreach ($attr as $v)
  {
      echo"
      <tr>
      <td>{$v[1]}</td>
      <td>{$v[3]}</td>
      <td>{$v[4]}</td>
      <td><input type='button' value='详情' class='btn1' code='{$v[0]}' ></td>  
      </tr>
      ";
  }
 ?>
 </tr>
</table>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(e) {    
    $(".btn1").click(function(e) {
        //找主键值
        var code =$(this).attr("code")
        //根据主键查询
        $.ajax({
        url: "16623-2.php",
        type:"POST",
        dataType:"TEXT",
         data:{c:code}, 
         success: function(data)
        {  
            var lie=data.split("^");
            //引用外部弹窗样式
            var html = "<div style='color:red'>代号名"+lie[0]+"</div><div>汽车名"+lie[1]+"<div></div>汽车系列"+lie[2]+"<div></div>上市时间"+lie[3]+"<div></div>油耗"+lie[4]+"<div></div>功率"+lie[5]+"<div></div>排量"+lie[6]+"<div></div>价格"+lie[7]+"</div>";
            //var button ="<input type='button' value='确定' /><input type='button' value='取消' />";
            var win = new Window({
                
                width : 500, //宽度
                height : 400, //高度
                title : '测试弹窗', //标题 
                content : html, //内容
                isMask : false, //是否遮罩
                //buttons : button, //按钮
                isDrag:true, //是否移动
                
                });
        
        
    
        }
        });
    });    
});
</script>

处理页面

?php
include("../DBDA.class.php");
$db=new DBDA();
$sql="select * from nation";
$attr=$db->query($sql);
$str="";
foreach($attr as $v)
{
    $str=$str.implode("^",$v);
    $str=$str."|";
}
substr($str,0,strlen($str)-1);
echo $str;

转载于:https://www.cnblogs.com/zoubizhici/p/5614375.html

weixin_30606669

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
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>...
复制链接

扫一扫