详细叙述ajax的详情,ajax“显示弹窗详情”和“删除”功能练习(示例代码)

1.查看详细信息，以弹窗的形式显示，使用ajax

2.批量删除

“查询”功能可以参考前面的文章，这里只讲解ajax“显示弹窗详情”和“删除”功能

第一:在body中的代码

ajax汽车网页查询

.xq

{

width:90px;

height:20px;

color:#000;

text-align:center;

line-height:20px;

vertical-align:middle;

}

.xq:hover

{

cursor:pointer;

background-color:#0FF;

color:#F00;

}

汽车查询网页

请输入名称：

第二：因为使用ajax，所以代码大部分是在JScript，现实页面函数xianshi()

$(document).ready(function(e) {

xianshi();

//页面显示

function xianshi()

{

$.ajax({

async:false,

url:"chuli.php",

data:{type:0},

type:"POST",

dataType:"TEXT",

success: function(data){

var hang=data.split("|");

var str="

代号名称操作";

for(var i=0;i

{

var lie=hang[i].split("^");

str+="

"+lie[0]+""+lie[1]+" 查看详情";

}

str+="

全选";

$("#xianshi").html(str);

}

});

第三：查看详情添加弹窗

//给查看详情添加弹窗

$(".xq").click(function(){

var code=$(this).attr("bs");

$.ajax({

async:false,

url:"chuli.php",

data:{code:code,type:1},

type:"POST",

dataType:"TEXT",

success: function(data)

{

var lie=data.split("^");

var html="

名称："+lie[1]+"

生产时间："+lie[3]+"

油耗："+lie[4]+"

动力："+lie[5]+"

排放量："+lie[6]+"

价格："+lie[7]+"

";

var Wd=new Window({

width:600,

height:400,

title:\'汽车详情\',

content:html,

isMask:true,

buttons:"",

isDrag:true,

});

},

});

});

第四：全选功能

//全选

$("#all").click(function(){

var jd=$(this)[0].checked;

var jc=$(".m");

jc.prop("checked",jd);

});

第五：批量删除功能

//批量删除

$("#del").click(function(){

var jc=$(".m");

var str="";

for(var i=0;i

{

if(jc.eq(i).prop("checked"))

{

str+=jc.eq(i).val()+"|";

}

}

str = str.substr(0,str.length-1);

$.ajax({

async:false,

url:"chuli.php",

data:{str:str,type:2},

type:"POST",

dataType:"TEXT",

success: function(data)

{

alert(data);

xianshi();

},

});

});

第六：ajax中调用的chuli.php页面

include("DBDA.class.php");

$db=new DBDA();

$type=$_POST["type"];

switch($type)

{

case 0:

$sql = "select * from car";

echo $db->StrQuery($sql);

break;

case 1:

$code = $_POST["code"];

$sql = "select * from car where Code = \'{$code}\'";

echo $db->StrQuery($sql);

break;

case 2:

$str = $_POST["str"];

$attr = explode("|",$str);

$tj = implode($attr,"\',\'");

$sql = "delete from car where Code in (\'{$tj}\')";

if($db->Query($sql,1))

{

echo "删除成功！";

}

else

{

echo "删除失败！";

}

break;

default:

echo "";

}