ajax全选、全不选、反选、单删/批删

发布时间：2023-09-06 02:35责任编辑：蔡小小关键词：暂无标签

//接收当前页
$page = empty($_GET[‘page‘])?1:$_GET[‘page‘];
//求出总条数
$sql = "select * from user";
$res = mysqli_query($link,$sql);
$count = mysqli_num_rows($res);
//每页显示多少条
$length = 3;
//求出总页数
$num_page = ceil($count/$length);
//偏移量
$limit = ($page-1)*$length;
//查询
$sql2 = "select * from user limit $limit,$length";
$res2 = mysqli_query($link,$sql2);
while($a=mysqli_fetch_assoc($res2)){
???$data[‘data‘][] = $a;
}

$data[‘home_page‘] = 1;
$data[‘prev_page‘] = $page-1<1?1:$page-1;
$data[‘next_page‘] = $page+1>$num_page?$num_page:$page+1;
$data[‘last_page‘] = $num_page;

?>
<table>
???<tr>
???????<th>选择</th>
???????<th>ID</th>
???????<th>用户名</th>
???????<th>密码</th>
???????<th>性别</th>
???????<th>年龄</th>
???????<th>班级</th>
???????<th>手机</th>
???????<th>编辑</th>
???</tr>
???<div id="main">
???<?php foreach($data[‘data‘] as $k=>$v){ ?>
???<tr id="<?php echo $v[‘user_id‘];?>">
???????<td><input type="checkbox" name="check" value="<?php echo $v[‘user_id‘];?>"></td>
???????<td><?php echo $v[‘user_id‘];?></td>
???????<td><?php echo $v[‘username‘];?></td>
???????<td><?php echo $v[‘pwd‘];?></td>
???????<td><?php echo $v[‘sex‘];?></td>
???????<td><?php echo $v[‘age‘];?></td>
???????<td><?php echo $v[‘class_name‘];?></td>
???????<td><?php echo $v[‘phone‘];?></td>
???????<td>
???????????<a href="">修改</a>
???????</td>
???</tr>
???<?php } ?>
</div>
</table>

<button onclick="fun1()">全选</button>
<button onclick="fun2()">全不选</button>
<button onclick="fun3()">反选</button>
<button onclick="fun4()">单删/批删</button>
<script>
???

???function fun1(){
???????var check = document.getElementsByName(‘check‘);
???????for(var i=0;i<check.length;i++){
???????????if(check[i].checked==false){
???????????????check[i].checked=true;
???????????}
???????}
???}

???function fun2(){
???????var check = document.getElementsByName(‘check‘);
???????for(var i=0;i<check.length;i++){
???????????if(check[i].checked==true){
???????????????check[i].checked=false;
???????????}
???????}
???}

???function fun3(){
???????var check = document.getElementsByName(‘check‘);
???????for(var i=0;i<check.length;i++){
???????????if(check[i].checked==true){
???????????????check[i].checked=false;
???????????}else{
???????????????check[i].checked=true;
???????????}
???????}
???}

???function fun4(){
???????var arr = document.getElementsByName(‘check‘);
???????var ar = [];
???????for(var i=0;i<arr.length;i++){
???????????if(arr[i].checked==true){
???????????????ar.push(arr[i].value);
???????????}
???????}

???????var id = ar.toLocaleString();
???????if(id==‘‘){
???????????alert(‘请先选择一项‘);
???????????return false;
???????}else{
???????????//ajax请求
???????????var ajax = new XMLHttpRequest();
???????????ajax.open("get","delete.php?id="+id);
???????????ajax.send();
???????????ajax.onreadystatechange=function(){
???????????????if(ajax.readyState==4 && ajax.status==200){
???????????????????//alert(ajax.responseText);
???????????????????//成功
???????????????????if(ajax.responseText==1){

???????????????????????for(var i=0;i<ar.length;i++){
???????????????????????????var tr=document.getElementById(ar[i]);
???????????????????????????tr.remove();
???????????????????????}

???????????????????}
???????????????}
???????????}
???????}
???}
</script>

$data[‘home_page‘] = 1;
$data[‘prev_page‘] = $page-1<1?1:$page-1;
$data[‘next_page‘] = $page+1>$num_page?$num_page:$page+1;
$data[‘last_page‘] = $num_page;

<button onclick="fun1()">全选</button>
<button onclick="fun2()">全不选</button>
<button onclick="fun3()">反选</button>
<button onclick="fun4()">单删/批删</button>
<script>
???

???????????????????????for(var i=0;i<ar.length;i++){
???????????????????????????var tr=document.getElementById(ar[i]);
???????????????????????????tr.remove();
???????????????????????}

???????????????????}
???????????????}
???????????}
???????}
???}
</script>

ajax全选、全不选、反选、单删/批删

原文地址：https://www.cnblogs.com/DXYHW/p/10551038.html

ajax全选、全不选、反选、单删/批删

知识推荐