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 ...
随机推荐
- java中的IO流之文件复制
O(∩_∩)O哈哈~ 1.综述 一门成熟的语言肯定具备的几个模块:IO,通信,线程,UI...... Java作为一门成熟的程序语言,其IO流是比较复杂的.上个图大家感受下: 简单分析一下,IO分为两 ...
- mailx 乱码,sendmail发html邮件,脚本开机启动
echo "yes"|mailx -s "我" -S ttycharset=utf-8 -S sendcharsets=utf-8 -S encoding=ut ...
- 装载:对CSS中的Position、Float属性的一些深入探讨
对CSS中的Position.Float属性的一些深入探讨 对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个 ...
- SQLite中的PRAGMA语句攻略
原文地址:http://iihero.iteye.com/blog/1189633 PRAGMA语句是SQLITE数据的SQL扩展,是它独有的特性,主要用于修改SQLITE库或者内数据查询的操作.它采 ...
- no module named staticfiles
原地址:http://blog.sina.com.cn/s/blog_77500e110100umms.html 今天想试一下django的Uploadify,找了个例子,运行时出错:myprojec ...
- Sqli-labs less 46
Less-46 从本关开始,我们开始学习order by 相关注入的知识. 本关的sql语句为$sql = "SELECT * FROM users ORDER BY $id"; ...
- MYSQL注入天书之后记
后记 对于工具的看法: 我之所以在每个例子中只写了几个示例,是因为我希望你能通过这一两个示例举一反三将其他的列出来.如果让我来完成每一次完整的注入,应该在知道原理的情况下,必然使用工具或者自己写代码实 ...
- 互联网 IT 精英:龙泉寺静心之旅
最近几天,大家都被<北京龙泉寺:最强科研组织!扫地僧点化微信之父,清华北大学子排队出家>这篇文章刷屏了.无论是「微信之父」张小龙闭关修行,还是北大清华中科院的硕士生.博士生义工,亦或是「贤 ...
- Linux Rsync
一.Rsync介绍 1.什么是Rsync Rsync 即Remote Rynchronization,是一款开源的.快速的.多功能的.可实现全量或增量的本地或者远程数据镜像同步复制.备份的优秀工具. ...
- POJ 2182
#include <iostream> #define MAXN 8005 using namespace std; int _m[MAXN]; int main() { //freope ...