有胆量你就来跟着路老师卷起来！ -- 纯干货，技术知识分享
路老师给大家分享PHP语言的知识了，旨在想让大家入门PHP，并深入了解PHP语言。
本文给大家接着上篇文章进行图书删除功能的优化，实现批量删除图书的功能。
1 添加删除按钮
<div class="panel-heading">
图书列表
<button id="goAdd" style="margin-left: 30px;" class="btn btn-primary btn-sm">
<i class="fa fa-disk-o"></i>
新增
</button>
<button id="deleteBatch" style="margin-left: 10px;" class="btn btn-danger btn-sm">
<i class="fa fa-disk-o"></i>
删除
</button>
</div>显示页面如下：
2 表格前面的复选框
效果如下：
其中抽发选择的js逻辑如下：
let rows = new Array();
document.getElementById('goAdd').addEventListener('click', function() {
window.location.href = 'add.html'; // 将此处替换为你想要跳转的URL
});
document.getElementById('deleteBatch').addEventListener('click', function() {
console.log("rows:"+rows.length)
if(rows.length === 0) {
alert("请选择您要删除的数据！");
return false;
}
var msg = "确认要删除吗？\n\n请确认！";
if(confirm(msg)===true) {
console.log("js rows:"+rows)
var queryString = rows.join(',');
console.log("queryString:"+queryString)
// PHP文件的URL
var deleteBatch = 'deleteBatch.php';
// 使用fetch API发送请求
fetch(deleteBatch + '?rowIds=' + queryString,{method:'GET'})
.then(response => response.text())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
} else {
return false;
}
});
$(document).ready(function() {
$('#selectAll').click(function() {
$('.selectRow').prop('checked', this.checked);
var curr = $(this).is(':checked');
console.log("kskskksk"+curr)
$('.selectRow').each(function() {
var currentId = $(this).attr('value');
var current_checked =$(this).is(':checked');
console.log(currentId)
if(current_checked){
rows.push(currentId);
}else{
rows.pop(currentId);
}
});
});
$('.selectRow').click(function() {
console.log($(this).is(':checked'))
var current_rowId = $(this).closest('tr').find('.selectRow').val();
console.log("current_rowId:"+current_rowId);
if($(this).is(':checked')){
rows.push(current_rowId);
} else{
rows.pop(current_rowId);
}
if ($('.selectRow:checked').length === $('.selectRow').length) {
$('#selectAll').prop('checked', true);
} else {
$('#selectAll').prop('checked', false);
}
});
});3 实现php的后端逻辑
<?php
// 数据库连接参数
$host = 'localhost';
$username = 'root';
$password = 'passwd';
$dbname = 'db_test';
// 创建连接
$conn = new mysqli($host, $username, $password, $dbname);
// 检查连接
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
// 假设这是你想要删除的rowIds数组
$rowIds = $_GET['rowIds'];
// 准备SQL语句
$sql = "DELETE FROM books WHERE id IN ($rowIds)";
// 执行SQL语句
if ($conn->query($sql) === TRUE) {
echo "删除成功！";
} else {
echo "错误: " . $sql . "<br>" . $conn->error;
}
// 关闭连接
$conn->close();
?>4 删除演示
- 随机选择两条数据：
- 点击确定删除：
- 删除后的结果：
下一篇 数据抽象层（这回是真的）
大家如果喜欢技术，并想有个好的交流平台可以关注我的 我的知乎首页，会不定期分享本人觉得比较好的技术类电子书。
另外，自己创建的一个技术qq群，玩转技术群，该群里功能：分享技能，电子书，源代码，以及兼职项目等交流，欢迎大家加入一起交流。
