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 ...
随机推荐
- android开发,静音录制视频,在一般清晰度的前提下保证文件大小越小越好
public void startRecord() { mediarecorder = new MediaRecorder();// 创建mediarecorder对象 mCamera = getCa ...
- 【Insertion Sorted List】cpp
题目: Sort a linked list using insertion sort. 代码: /** * Definition for singly-linked list. * struct L ...
- NYOJ-206 矩形的个数 AC 分类: NYOJ 2013-12-29 22:19 265人阅读 评论(0) 收藏
这题目是小学奥数题目,方法可以百度到,但是,有个难点就是,数据类型大小不够,如果是1000x1000的矩阵,那么就会超过int的范围,所以,就引进了long long的数据类型 #include< ...
- load d3dcompiler_46.dll failed
https://gist.github.com/rygorous/7936047 编shader的时候遇到这个warning不知道是不是什么隐患..从今天开始要做新项目了 尝试从同事那里要了这dll ...
- Linux内存分配----SLAB
动态内存管理 内存管理的目标是提供一种方法,为实现各种目的而在各个用户之间实现内存共享.内存管理方法应该实现以下两个功能: 最小化管理内存所需的时间 最大化用于一般应用的可用内存(最小化管理开销) 内 ...
- java cookie
public static void AddCookie(HttpServletResponse response, String key, String value) { Cookie cookie ...
- Codeforces Round #258 (Div. 2)(A,B,C,D)
题目链接 A. Game With Sticks time limit per test:1 secondmemory limit per test:256 megabytesinput:standa ...
- 一个轻量级的3D CSS 库
JavaScript 3D library 该项目的目的是为了打造轻量级的.实用简单的3D CSS库. Usage使用方法 下载 minified库文件 和 css文件,并将其包含于你的HTML中,就 ...
- lintcode:排颜色 II
排颜色 II 给定一个有n个对象(包括k种不同的颜色,并按照1到k进行编号)的数组,将对象进行分类使相同颜色的对象相邻,并按照1,2,...k的顺序进行排序. 样例 给出colors=[3, 2, 2 ...
- Maven的安装
我对maven的了解,仅仅局限在百度百科. 由于近期公司需求,我找到了个maven教程:http://wentao365.iteye.com/blog/903396 安装maven其实很简单,就是在A ...