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

<meta charset="utf-8">
<?php
//链接数据库
$link = mysqli_connect('127.0.0.1','root','root','mone');
//设置字符集
mysqli_query($link,'set names utf8');


//接收当前页
$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 οnclick="fun1()">全选</button>
<button οnclick="fun2()">全不选</button>
<button οnclick="fun3()">反选</button>
<button οnclick="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>

 

 

<meta charset="utf-8">
<?php
//链接数据库
$link = mysqli_connect('127.0.0.1','root','root','mone');
//设置字符集
mysqli_query($link,'set names utf8');


//接收当前页
$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 οnclick="fun1()">全选</button>
<button οnclick="fun2()">全不选</button>
<button οnclick="fun3()">反选</button>
<button οnclick="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>

转载于:https://www.cnblogs.com/DXYHW/p/10551038.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值