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 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[]}</td>
<td>{$v[]}</td>
<td>{$v[]}</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[]+"</div><div>汽车名"+lie[]+"<div></div>汽车系列"+lie[]+"<div></div>上市时间"+lie[]+"<div></div>油耗"+lie[]+"<div></div>功率"+lie[]+"<div></div>排量"+lie[]+"<div></div>价格"+lie[]+"</div>";
//var button ="<input type='button' value='确定' /><input type='button' value='取消' />";
var win = new Window({ width : , //宽度
height : , //高度
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,,strlen($str)-);
echo $str;


ajax练习习题一弹窗查看的更多相关文章
- 弹窗查看内容时 内容滚动区域设置为body区
看到渣浪的查看文章或者查看大图有个效果:弹窗查看内容时,如果内容过长有滚动条,则滚动条会被放到body区滚动 什么意思呢? 看个图片,一般正常弹窗是有宽高限制的,如果内容过长则直接在弹窗中进行滚动 点 ...
- 11月10日下午 ajax做显示信息以后用ajax、Bootstrp做弹窗显示信息详情
1.用ajax做弹窗显示信息详情 nation.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...
- 11.11 开课二个月零七天(ajax和bootstrp做弹窗)
1.用ajax做弹窗显示信息详情 nation.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...
- ajax做显示信息以后用ajax、Bootstrp做弹窗显示信息详情
1.用ajax做弹窗显示信息详情 nation.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...
- ajax对数据删除、查看详情功能
运用bootstrap,jquery和ajax显示一些数据,附加删除功能并且点击能弹出模态框详情功能 主页面main.php <!DOCTYPE html PUBLIC "-//W3C ...
- ajax练习习题三搜索
做一个汽车搜索页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
- ajax练习习题二三级联动
异步执行 1数据传输收发数据的时候不用等待对方接受,可以继续发送 2Ajax 在调用处理页面处理数据的时候,下面的代码可以继续执行,效率高 同步执行 1收发数据的时候要等到对方接受的成功,才可以继续发 ...
- AJAX里使用的弹窗样式 tanchuang.js tanchuang.css
tanchuang.js // 每个弹窗的标识 var x =0; var idzt = new Array(); var Window = function(config){ //ID不重复 idz ...
- Django中数据传输编码格式、ajax发送json数据、ajax发送文件、django序列化组件、ajax结合sweetalert做二次弹窗、批量增加数据
前后端传输数据的编码格式(contentType) 提交post请求的两种方式: form表单 ajax请求 前后端传输数据的编码格式 urlencoded formdata(form表单里的) ja ...
随机推荐
- Oracle 相关概念详解
一.前言 笔者对于Oracle数据库的理解,很长时间停留在“镜花水月”的状态,你说不懂吧,又会用,一较真起来吧,对一些基本概念又说不出一个道道来~如果想要在编码的路上走得更远,这个必定也是绕不过的坎, ...
- UVALive - 6575 Odd and Even Zeroes 数位dp+找规律
题目链接: http://acm.hust.edu.cn/vjudge/problem/48419 Odd and Even Zeroes Time Limit: 3000MS 问题描述 In mat ...
- IEEE 802.11 标准列表
IEEE 802.11 标准列表 IEEE 802.11,1997年,原始标准(2Mbit/s,播在2.4GHz). IEEE 802.11a,1999年,物理层补充(54Mbit/s,播在5GHz) ...
- 使用IntersectionObserver更高效的监视某个页面元素是否进入了可见窗口
比如说,你想跟踪 DOM 树里的一个元素,当它进入可见窗口时得到通知. 也许想实现即时延迟加载图片功能,或者你需要知道用户是否真的在看一个广告 banner. 你可以通过绑定 scroll 事件或者用 ...
- 【BZOJ】【3907】网格
组合数学/python 3907: 网格 Time Limit: 1 Sec Memory Limit: 256 MBSubmit: 162 Solved: 76[Submit][Status][ ...
- Poj 2528 Mayor's posters 分类: Brush Mode 2014-07-23 09:12 84人阅读 评论(0) 收藏
Mayor's posters Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 40570 Accepted: 11798 ...
- 对LVS DR模式的理解
Client向vip发请求,lvs接收 Src mac Dst mac type … Src ip Src port Dst ip Dst port … CRC Mac1 Mac2 … … 192.1 ...
- HDOJ 1050 Moving Tables
Moving Tables Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Tot ...
- javascript设计模式--单例模式(Singleton)
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...
- 高质量图形库:pixellib
点这里 pixellib 是高质量 2D 图形库: 高质量抗锯齿,矢量图形绘制 多种图像格式: RGB, BGR, ARGB, ABGR, RGBA, BGRA 8 / 15 / 16 / 24 / ...