<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-2.1.1.min.js"></script>
<style type="text/css">
.sr
{
background-color:#0F0;
font-size:16px;
color:#C66
}
.sr:hover
{
background-color:#309
} </style>
</head> <body>
<input type="button" id="btn" value="点击出现表格" style="width:100px"/>
<table border="1" cellpadding="0" cellspacing="0" width="100%" id="xianshi"> </table>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
$("#btn").click(function(e) {
Showall();
binkck(); });
<!--删除函数-->
function binkck()
{
$(".sr").click(function() {
var code = $(this).attr("bs");
$.ajax({
async:false,
url:"delete.php",
data:{code:code},
type:"POST",
dataType:"TEXT",
success: function(data)
{
if(data.trim()=="OK")
{
Showall();
binkck();
}
else
{
alert("失败");
} }
}) }); } <!--表格函数-->
//思路:把所有的数据做成字符语句,最后放入 html()输出
function Showall()
{
$.ajax({
async:false,
url:"chuli2.php",
dataType:"TEXT", //必须大写 dataType
success: function(data)
{
//把数据库的数据拼接,拿出来,然后拆分,最后组成字符语句,放入html()输出
var str="<tr><td>code</td><td>2</td><td>3</td></tr>";
          //不要把表头放入table 表格,因为后面的$("#xianshi").html() 会覆盖掉
var hang=data.split("|");
for(var i=0;i<hang.length;i++)
{
str=str+"<tr>";
var lie =hang[i].split("^");
for(var j=0;j<lie.length;j++)
{
str=str+"<td>"+lie[j]+"</td>";
}
str+="<td class='sr' bs='"+lie[0]+"'>删除</td></tr>";
}
$("#xianshi").html(str); //输出
} })
} }); </script> </html>
 

chuli2.php

 
<?php
include("./Tp.class.php");
$db = new Tp(); $sql = "select * from nation"; $attr = $db->query($sql); $r="";
foreach($attr as $v)
{
$r=$r.implode("^",$v); //数组内,字符拼接
$r=$r."|"; //数组之间,用"|"拼接
} $str=substr($r,0,strlen($r)-1);  //取字符串
echo $str; ?>
 

delete.php

 
<?PHP
//接受数据
$code = $_POST["code"];
//加载类
include("./Tp.class.php");
$db=new Tp();
$sql="delete from nation where Code='{$code}'";
$result = $db->query($sql,1);
//不要进行 $attr = $result 操作,这是一次数据输出操作,会录入data
if($result)
{
echo "OK";
}
else
{
echo "NO";
}

AJAX 创建表格的更多相关文章

  1. AJAX创建表格,删除数据

    主页面 <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8 ...

  2. Hive创建表格报【Error, return code 1 from org.apache.hadoop.hive.ql.exec.DDLTask. MetaException】引发的血案

    在成功启动Hive之后感慨这次终于没有出现Bug了,满怀信心地打了长长的创建表格的命令,结果现实再一次给了我一棒,报了以下的错误Error, return code 1 from org.apache ...

  3. 示例-创建表格-指定行列&删除表格的行和列

    <body> <script type="text/javascript"> /* *上面的方法和你麻烦. *既然操作的是表格, *那么最方便的方式就是使用 ...

  4. 示例-创建表格&使用表格对象

    @charset "utf-8";/* CSS Document */table{ border:#249bdb 1px solid; width:500px; border-co ...

  5. JavaScript创建表格的两种方式

    方式一: var data = [ { id: 1, name: "first", age: 12 }, { id: 2, name: "second", ag ...

  6. 如何利用Dreamwever快速创建表格???

    这样的一张表,用table写完感觉好累,很多单元格都不一样大,还要单独设置样式,今天还分享下用Dreamwever快速创建表格. 可能这会有人知道了!当然是插入表格了!

  7. [原创]Devexpress XtraReports 系列 2 创建表格报表

    昨天发表了Devexpress XtraReports系列开篇,今天我们继续. 今天的主题是创建表格报表. 首先我们来看看最后实现的效果.Demo最后附上. 接下来开始讲解如何一步一步做出这个报表: ...

  8. 使用JS创建表格以及隔行换色(包括隔N行换色)

    <html> <head> <title></title> <style> table{ width:800px; border-colla ...

  9. 今天学习了无序列表和有序列表和使用HTML5创建表格

    ol建立有序列表,该列表可以用设置type="A/a" 其语法架构为 <ol> <li></li> <li></li> ...

随机推荐

  1. python从初识到精通1

    Python3 基本数据类型 Python 中的变量不需要声明.每个变量在使用前都必须赋值,变量赋值以后该变量才会被创建. 在 Python 中,变量就是变量,它没有类型,我们所说的"类型& ...

  2. Oracle的闪回技术--闪回错误的DML操作

    提交DML操作后,该操作使用的还原段就可以被其它对象使用了,为了保证闪回操作时这些数据仍然被保存在还原段中,可能需要重新设置undo_retention参数,表示一个事务提交后,该事务的数据必须保存在 ...

  3. RTMP直播应用与延时分析

    直播应用中,RTMP和HLS基本上可以覆盖所有客户端观看,HLS主要是延时比较大,RTMP主要优势在于延时低. 一.应用场景 低延时应用场景包括:  .  互动式直播:譬如2013年大行其道的美女主播 ...

  4. vertical-align属性详解

    vertical-align属性详解:http://www.cnblogs.com/wcp-spring/archive/2013/03/04/2942456.html 关于vertical-alig ...

  5. PowerTool(杀毒辅助工具) V4.6 中文免费绿色版

    软件名称: PowerTool(杀毒辅助工具)软件语言: 简体中文授权方式: 免费软件运行环境: Win7 / Vista / Win2003 / WinXP 软件大小: 968KB图片预览: 软件简 ...

  6. 删除和创建ms sql的分区文件

    今天测试ms sql 的表分区的时候,不小心搞错了分区的条件.然后我想重新做一次,操作流程如下(按顺序) 1:删除SCHEME DROP  PARTITION SCHEME TestSPScheme ...

  7. linux重要目录说明

    1 home :root用户的home 目录是root,普通用户的home 目录是/home,users/(不要随便使用root权限,小白容易改错东西哒) 2 bin:常用可执行文件:/bin./us ...

  8. Mybatis的失误填坑-java.lang.Integer cannot be cast to java.lang.String

    Mybatis的CRUD小Demo 为方便查看每次的增删改结果,封装了查询,用来显示数据库的记录: public static void showInfo(){ SqlSession session ...

  9. 【转】Matrix67:十个利用矩阵乘法解决的经典题目

    好像目前还没有这方面题目的总结.这几天连续看到四个问这类题目的人,今天在这里简单写一下.这里我们不介绍其它有关矩阵的知识,只介绍矩阵乘法和相关性质.    不要以为数学中的矩阵也是黑色屏幕上不断变化的 ...

  10. A- Bear and Five Cards(codeforces ROUND356 DIV2)

    A. Bear and Five Cards time limit per test 2 seconds memory limit per test 256 megabytes input stand ...