admin管理员组

文章数量:1516870

html页面拼接,表格数据

controler层：

 @RequestMapping("/a2")public List<User> a2(){LinkedList<User> list = new LinkedList<>();list.add(new User("python",1,"男"));list.add(new User("java",3,"女"));list.add(new User("sql",6,"男"));return list;}

js代码：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head><title>$Title$</title><script src="${pageContext.request.contextPath}/statics/js/jquery-3.6.0.js"></script><script>$(function () {$("#btn").click(function () {//$.post(url, param[可以省略] success)$.post("${pageContext.request.contextPath}/a2", function (data) {var html = '';for (let i = 0; i < data.length; i++) {html += "<tr>" +"<td>" + data[i].name + "</td>" +"<td>" + data[i].age + "</td>" +"<td>" + data[i].sex + "</td>" +"</tr>"}$("#content").html(html)})})});</script>
</head>
<body>
<input type="button" value="加载数据" id="btn">
<table><tr><td>姓名</td><td>年龄</td><td>性别</td></tr><tbody id="content"><%--      数据 后台--%></tbody>
</table>
</body>
</html>

点击加载数据，触发事件
效果图：

本文标签： html页面拼接表格数据

版权声明：本文标题：html页面拼接,表格数据 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://www.betaflare.com/web/1687865478a150921.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。