图书管理系统中的归还书籍操作详解-CSDN博客

本文链接：https://blog.csdn.net/weixin_57726512/article/details/120328425

归还书籍是图书管理系统核心功能，涉及jQuery、layui和bootstrap插件。包括分页查询、归还、超期、延期和报废等操作。超期书籍需计算逾期费用，不可延期；刚借书籍可延期报废。页面交互中，按钮和表格单选框需绑定事件，实现功能逻辑。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

归还书籍是图书管理系统中最重要的一部分，也可以说是整个图书管理系统的中心。

归还书籍的视图页面需要使用到jQuery插件，layui插件，bootstrap插件。它有分页查询，归还书籍，超期书籍，延期书籍，和报废书籍几个部分，与其他地方不同的是，它不是新增修改删除，但又与新增修改删除有共同点。所以才会称为图书归还系统中的中心点。

    <div>
        <div class="container">
            <!-- 顶部搜索和操作区域 -->
            <div class="row justify-content-between mt-3">
                <div class="col">
                    <form id="formSearch" autocomplete="off">
                        <div class="row">
                            <div class="row mt-2">
                                <label class="col-form-label col-auto" for="searchText">搜索:</label>
                                <input type="text" class="form-control col" style="width:500px" id="searchText" name="searchText" placeholder="模糊搜索书籍数据" oninput="tabStudentSearch()">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="col-auto">
                    <button class="layui-btn layui-btn-radius layui-btn-normal" type="button" id="returnNav" onclick="returnBook()">归还</button>
                </div>
                <div class="col-auto">
                    <button class="layui-btn layui-btn-radius layui-btn-normal" type="button" id="delayNav">延期</button>
                </div>
                <div class="col-auto">
                    <button class="layui-btn layui-btn-radius layui-btn-normal" type="button" id="exceedNav">超期</button>
                </div>
                <div class="col-auto">
                    <button class="layui-btn layui-btn-radius layui-btn-normal" type="button" id="scrapNav">报废</button>
                </div>
            </div>
            <!-- 表格部分 -->
            <div class="row">
                <div class="col">
                    <table id="tabStudent" lay-filter="tabStudent"></table>
                </div>
            </div>
        </div>
        <!--模态框 -->
        <div class="modal fade" id="studentModal" data-backdrop="static" data-keyboard="false">
            <div class="modal-dialog">
                <div class="modal-content">
                    <!-- 顶部 标题 关闭按钮 -->
                    <div class="modal-header">
                        <!--标题-->
                        <h5 class="modal-title" id="modalTitle">还书</h5>
                        <!--关闭按钮-->
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <!-- 内容部分 表单-->
                    <div class="modal-body">
                        <form id="formStudent">
                            <!--隐藏域  学生id-->
                            <input type="hidden" id="userId" name="userId" />
                            <input type="hidden" id="recordId" name="recordId" />
                            <input type="hidden" id="bookId" name="bookId" />
                            <input type="hidden" id="bookStateId" name="bookStateId" />
                            <div class="col-6">
                                <div class="layui-form-item">
                                    <p style="font-size:13px;color:#414959;padding:0px 0px 3px 7px">借书账号</p>
                                    <input type="text" name="account" id="account" placeholder="请填写" autocomplete="off" class="layui-input" disabled>
                                </div>
                                <div class="layui-form-item">
                                    <p style="font-size:13px;color:#414959;padding:0px 0px 3px 7px">ISBN</p>
                                    <input type="text" name="ISBN" id="ISBN" placeholder="请填写" autocomplete="off" class="layui-input" disabled>