局部刷新老师能给点提示吗?
<%@page contentType="text/html;charset=utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图书后台管理</title>
<link rel="stylesheet" href="css/index.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<script type="text/javascript" src="js/jquery-3.5.1.min.js"></script>
</head>
<body>
<header>
<div class="container">
<nav>
<a href="/books/management?method=book" >图书信息管理</a>
</nav>
<nav>
<a href="/books/management?method=category" >分类管理</a>
</nav>
</div>
</header>
<section class="banner">
<div class="container">
<div>
<h1>图书管理系统</h1>
<p>图书信息管理</p>
</div>
</div>
</section>
<section class="main">
<div class="container">
<form class="form-horizontal" action="/searchBook" method="post">
<div class="form-group" style="float: right;">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-primary">查询</button>
</div>
</div>
<div class="form-group" style="float: right;width: 300px;">
<div class="col-sm-8">
<input name="searchContent" class="form-control" id="searchContent"
placeholder="输入要查询的分类" style="width: 250px">
</div>
</div>
</form>
</div>
<div class="container">
<table class="table table-striped">
<thead>
<tr>
<th>序号</th>
<th>图书编号</th>
<th>图书名称</th>
<th>分类</th>
<th>价格</th>
<th>备注</th>
<th>图书封面</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<c:forEach items="${list }" var="book" varStatus="i">
<tr id="tr1">
<td>${i.index+1 }</td>
<td>${book.id }</td>
<td>${book.name }</td>
<td>${book.category }</td>
<td><fmt:formatNumber value="${book.price }" pattern="¥0.00"></fmt:formatNumber></td>
<td>${book.decript }</td>
<td><img src="${book.preview }" style="width:160px;height:90px;"></td>
<td>
<a href="/books/management?method=findid&bookid=${book.id }">修改</a>
<a href="/deleteBook?bookId=book0001">删除</a>
</td>
<!--在循环显示数据时,此处的book0001可以用EL表达式进行替换-->
</tr>
</c:forEach>
</tbody>
</table>
</div>
</section>
<section class="page">
<div class="container">
<div id="fatie">
<a href="/books/management?method=addbook"><button>新建</button></a>
</div>
</div>
</section>
<footer>
copy@慕课网
</footer>
</body>
</html>21
收起
正在回答 回答被采纳积分+1
2回答
好帮手慕阿园
2020-09-12 18:23:12
同学你好,单击触发ajax的内容,可以先书写一个按钮,对按钮添加单击事件,例如
使用jquery获取到这个按钮并添加onclick事件,当单击时,触发ajax请求。例如:
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript">
$("#search").click(function(){
$.ajax({
"url" : "/项目名/FindBookServlet",
"type" : "get",
/*发送对应的参数 比如获取id为bookID的value值提交*/
"data" : {"bookID":$("#bookID").val() ,...},
"dataType" : "json",
"success" : function(json){
//对接收的数据进行页面的添加
}
})
});
</script>关于ajax查询可以参考《jQuery与Ajax入门》教辅区的教辅《2-7使用Ajax完成新闻查询功能》,如下图

同学可以参考如下代码来完成ajax的查询

祝学习愉快
java工程师2020版
- 参与学习 人
- 提交作业 9410 份
- 解答问题 16556 个
综合就业常年第一,编程排行常年霸榜,无需脱产即可学习,北上广深月薪过万 无论你是未就业的学生还是想转行的在职人员,不需要基础,只要你有梦想,想高薪
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星