async 异步批量执行
html代码
<!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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>异步批量执行</title>
</head>
<script src="http://cdn.bootcss.com/jquery/1.12.3/jquery.min.js"></script>
<script src="layer.js" type="text/javascript" ></script>
<script src="async.min.js" type="text/javascript" ></script>
<style>
td{
height: 50px;
width:260px;
}
</style>
<body>
<table border="1">
<tr>
<td><div class="myid" id="1">121231321</div></td>
</tr>
<tr>
<td><div class="myid" id="2">22332121</div></td>
</tr>
<tr>
<td><div class="myid" id="3">65664545</div></td>
</tr>
<tr>
<td><div class="myid" id="4">77878889</div></td>
</tr>
<tr>
<td><div class="myid" id="5">555555456</div></td>
</tr>
</table>
<input type="button" id="button" value="批量提交" />
<script>
$(function(){
$("#button").click(function(){
var myids = new Array();
$(".myid").each(function(){
myids.push($(this).attr('id'));
})
if(myids.length==0){
layer.msg("没有符合条件的记录");
}
async.eachSeries(myids,function(myid,callback){
$.ajax({
url: 'async.php',
type: 'POST',
dataType: 'json',
data: {id: myid},
success:function(data){
if(data.state){
layer.tips('处理成功', '#'+myid);
}else{
layer.tips('处理失败', '#'+myid);
}
callback(null);
}
})
})
});
})
</script>
</body>
</html>
php代码
<?php
$id = isset($_POST['id'])?$_POST['id']:0;
$res = array();
$res['state'] = 1;
sleep(1);
if($id == 2){
$res['state'] = 0;
}
echo json_encode($res);
预览结果
