介绍
小编给大家分享一下ajax怎么实现页面加载和内容删除,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!
ajax最大的好处就在于加载和删除的时候不会跳转页面,现在的网页大多都会选择用ajax来写,相比嵌入PHP代码来说减少了代码量,同时加载页面也会比较快,下面是用ajax以数据库水果表为例写的加载页面和水果的删除,刚开始用ajax可能写起来还是会比较手生,就当是练习好了。
这是水果表:
,下面就是首页的代码了,先建一个PHP文件主要。php
& lt; body> & lt; h3>内容加载& lt;/h3> & lt; table 单元格边距=?”,单元格间距=?”,边境=?“,宽度=啊?00%;比; ,& lt; tr> & lt;才能td>水果名称& lt;/td> & lt;才能td>水果价格& lt;/td> & lt;才能td>水果产地& lt;/td> & lt; td>才能操作& lt;/td> ,& lt;/tr> ,& lt; tbody id=皌b"比; ,& lt;/tbody> & lt;/table> & lt;/body>
我选择的是在页面只显示水果表中的水果名称价格和产地这三列,下面我们就要写加载的处理页面了,建一个php文件,jiazaiym。php
, php & lt; ? 包括(“DADB.class.php"); $ db=new DADB (); $ sql=皊elect  *,得到fruit “; $ arr=$ db→查询($ sql); $ str=?“; foreach (arr 美元;as v)美元 { ,str=str.implode美元(“^“,v)美元!”|“,,//每一行之间用“|”连接,这样最后就会多出一个“|” } 美元$ str=substr (str 0 strlen (str)美元1);,//把最后多出的“|”用截取字符串的方式删去 echo str美元; 祝辞;
加载页面代码写完之后就可以正式的写ajax了,这些是要写在主。php中的。
& lt; script 类型=拔谋?javascript"比; ,. ajax({美元 url:才能“jiazaiym.php", 数据类型:才能“TEXT", 成功:函数才能(数据){ ,,var str =,““ ,,var hang =, data.split (“|“); ,,(var 我=0;i& lt; td>“+躺[1]+“& lt;/td> & lt; td>“+躺[2]+“& lt;/td> & lt; td>“+躺[3]+“& lt;/td> & lt; td> & lt; input type=& # 39;按钮# 39;,id=& # 39;“+躺[0]+“& # 39;,类=& # 39;sc # 39; https://www.yisu.com/zixun/, value='删除'/> " } $(" #结核病”). html (str); } }) 脚本>
<强>注意:强>在写ajax的时候要特别注意里面的分号和逗号,我自己总是把逗号写成分号,结果无法输出,在检查一遍代码无误后,才发现是逗号写错了,这是件非常令人头疼的事情只
写完加载页面之后我们要开始写删除页面了,建一个php文件shanchu。php,删除页面是非常简单的,和之前直接嵌入php是差不多的只
& lt; php ? $ id=$ _POST [“ids"]; 包括(“DADB.class.php"); $ db=new DADB (); $ sql=癲elete 得到fruit where id={$ id}“; 如果($ db→查询($ sql, 0)) { ,echo" OK"; } 其他{ ,echo" flase"; }
接下来在我要重新写一个ajax的时候会发现,写完之后不运行,因为在加载页面的时候删除里面的类不识别,这就需要我把删除放到加载的ajax里面了,同时把加载封装成一个方法,删除的时候调用一下就可以。
& lt; script 类型=拔谋?javascript"比; ,负载(); ,function 负荷(),{ . ajax({美元才能 ,,,url:“jiazaiym.php", ,,,数据类型:“TEXT", ,,,成功:function (数据),{ ,,,var str =,““ ,,,var hang =, data.split (“|“); ,,,for (var 小姐:=,0;,小姐:& lt;, hang.length;,我+ +),{ ,,,,var lie =,挂[我].split (“^“); ,,,,str =, str +,“& lt; tr> & lt; td>“, +,谎言[1],+,“& lt;/td> & lt; td>“, +,谎言[2],+,“& lt;/td> & lt; td>“, +,谎言[3],+,“& lt;/td> & lt; td> & lt; input type=& # 39;按钮# 39;,id=& # 39;“, +,谎言[0],+,“& # 39;,类=& # 39;sc # 39;, value=& # 39;删除& # 39;/祝辞& lt;/td> & lt;/tr>“ ,,,} ,,,美元(“# tb") . html (str); ,,,//删除页面 ,,,$ (“.sc") .click(函数(){ ,,,,var id=$(这).attr (“ids"); ,,,. ajax({美元 ,,,,url:,“shanchu.php", ,,,,数据:,{id: id}, ,,,,类型:,“POST", ,,,,数据类型:,“TEXT" ,,,,成功:,function (aa),{,//去空格 ,,,,,if (aa.trim (),==,“OK"), { ,,,,,,警报(“删除成功“); ,,,,,,负载(); ,,,,,} ,,,,,else { ,,,,,,警报(“删除失败“); ,,,,,} ,,,,} null null null null null nullajax怎么实现页面加载和内容删除