本身不是很擅长做前台，今天实现了个小功能，记录一下。
需求
网站首页(home.html) 有个模块，展示六张图片，要求每行显示三张。
POJO:
public class Sys_picture extends Model implements Serializable {
private String id; // 图片序号
private String picurl; // 图片url
}
html代码：
<div>
<table id="pics">
</table>
</div>
现状
跳转到首页的代码返回的是首页另一模块所需要的数据，所以无法在后台查询后传入首页。
解决方案
解决：使用ajax
$(document).ready(function () {
$.ajax({
url : "${base}/platform/cms/picture/data", // ajax异步请求
type : "get",
success : function (result) {
var data = result.data // 得到后台数据
var line = ''
for (var i = 0; i < data.length; i ++){ // 针对每个数据编写html
var picurl = data[i].picurl;
var tds = '<td style="padding:10px 10px"><img src="'+ picurl+'" height="300" width="400" ></td>';
if(i % 3 == 0){
line += '<tr>' + tds
}
else if(i % 3 == 2){
line += tds + '</tr>'
}else{
line += tds
}
}
$("#pics").append(line); // 显示到html
}
});
});
效果
image.png
