Ajax 加载数据 练习 自我有些迷糊了,写的大概请谅解 ^ _ ^
查询表的显示,查询显示如果不嵌入PHP代码的话,用ajax怎么实现?
<h1>显示数据</h1>
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>代号</td>
<td>姓名</td>
<td>性别</td>
<td>民族</td>
<td>生日</td>
<td>操作</td>
</tr> <tbody id="bg"> </tbody> </table> </body>
<script type="text/javascript"> $(document).ready(function(e) {
jiazai();
}); //加载数据的方法
function jiazai()
{
//异步
$.ajax({
url:"jiazai.php",
dataType:"TEXT",
success: function(data){
var hang = data.split("|"); var str = ""; for(var i=0;i<hang.length;i++)
{
var lie = hang[i].split("^");
str += "<tr><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td>"+lie[2]+"</td><td>"+lie[3]+"</td><td>"+lie[4]+"</td><td><input type='button' value='删除' class='shanchu' code='"+lie[0]+"' /></td></tr>";
} $("#bg").html(str); $(".shanchu").click(function(){ var code = $(this).attr("code");
$.ajax({
url:"shanchu.php",
data:{c:code},
type:"POST",
dataType:"TEXT",
success: function(d){
if(d.trim()=="OK")
{
//重新加载
jiazai();
}
else
{
alert("删除失败");
}
}
});
})
}
});
} </script>
再做个处理页面
<?php
include("DBDA.class.php");
$db = new DBDA(); $sql = "select * from info"; echo $db->StrQuery($sql);
再做个删除
<?php
include("DBDA.class.php");
$db = new DBDA();
$code = $_POST["c"];
$sql = "delete from info where code='{$code}'";
if($db->Query($sql,0))
{
echo "OK";
}
else
{
echo "NO";
}
主要学了ajax的封装方法,方法就叫做加载数据,当要求页面不刷新的时候,就用这个方法就可以
页面加载数据完成后,要调一遍
删除完之后需要再加载一遍,要在调一遍
Ajax 默认是异步的
异步就是 ajax去调处理页面,处理数据的时候,代码继续往下走
随机推荐
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
- Jade模板引擎让你飞
写在前面:现在jade改名成pug了 一.安装 npm install jade 二.基本使用 1.简单使用 p hello jade! 渲染后: <p>hello jade!</p ...
- word-wrap ,word-break 和white-space 的联系
在工作中我遇到一个问题,其实功能也不复杂,就是上面有个textarea标签 ,里面输入内容,下面有个显示效果 ,有个条件就是 上面输入的什么格式(比如换行等等),下面显示的也是 什么格式.如下图: 这 ...
- 在WPF中使用依赖注入的方式创建视图
在WPF中使用依赖注入的方式创建视图 0x00 问题的产生 互联网时代桌面开发真是越来越少了,很多应用都转到了浏览器端和移动智能终端,相应的软件开发上的新技术应用到桌面开发的文章也很少.我之前主要做W ...
- MVVM设计模式和WPF中的实现(四)事件绑定
MVVM设计模式和在WPF中的实现(四) 事件绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...
- 使用Java原生代理实现AOP
### 本文由博主柒.原创,转载请注明出处 ### 完整源码下载地址 [https://github.com/MatrixSeven/JavaAOP](https://github.com/Matri ...
- SDWebImage源码解读之SDWebImageCache(下)
第六篇 前言 我们在SDWebImageCache(上)中了解了这个缓存类大概的功能是什么?那么接下来就要看看这些功能是如何实现的? 再次强调,不管是图片的缓存还是其他各种不同形式的缓存,在原理上都极 ...
- 神技!微信小程序(应用号)抢先入门教程(附最新案例DEMO-豆瓣电影)持续更新
微信小程序 Demo(豆瓣电影) 由于时间的关系,没有办法写一个完整的说明,后续配合一些视频资料,请持续关注 官方文档:https://mp.weixin.qq.com/debug/wxadoc/de ...
- Create a Team in RHEL7
SOLUTION VERIFIED September 13 2016 KB2620131 Environment Red Hat Enterprise Linux 7 NetworkManager ...
- 封装集合(Encapsulate Collection)
封装就是将相关的方法或者属性抽象成为一个对象. 封装的意义: 对外隐藏内部实现,接口不变,内部实现自由修改. 只返回需要的数据和方法. 提供一种方式防止数据被修改. 更好的代码复用. 当一个类的属性类 ...