在前端页面点击立即参加按钮时或是点击查看详情按钮时， “ content:ctx+"/act/actDetail/"+activity.ac_id”无法根据当前所选中的数据获取到当前数据的id值进行值得传输，layUI的弹出层获取不到对应的信息
---ssm中的代码
@GetMapping("/list")
@ResponseBody
public List<Activity> getAllActivities() {
return tbActivityService.getAllActivities();
}
<script>
layui.use(['element', 'layer'], function(){
var element = layui.element;
var layer = layui.layer;
var activityList = $("#activityList");
$.ajax({
url: ctx + "/act/list",
type: "GET",
dataType: "json",
success: function(data) {
for (var i = 0; i < data.length; i++) {
var activity = data[i];
var card = $("<div>").addClass("card-container").addClass("layui-col-md4");
var inner = $("<div>").addClass("card-outer").addClass("layui-card");
var header = $("<div>").addClass("card-header").addClass("layui-card-header").text(activity.ac_name);
var body = $("<div>").addClass("card-body").addClass("layui-card-body");
var startTime = $("<p>").text("活动日期：" + formatTime(activity.ac_s_date)+" 至 "+ formatTime(activity.ac_e_date));
var participantCount = $("<p>").text("活动剩余：" + activity.participantCount+"人");
var status = $("<p>").text("状态：" + activity.status);
var attendedCount=$("<span class='layui-badge layui-bg-green'></span>").text("已有"+activity.attendedCount+"人参与");
var btnGroup = $("<div>").addClass("card-buttons").addClass("layui-btn-group");
var detailBtn = $("<button>").addClass("card-button").addClass("layui-btn layui-btn-warm layui-btn-sm").text("活动详情").css({"margin-bottom": "10px","margin-top": "10px"});
var joinBtn = $("<button>").addClass("card-button").addClass("layui-btn layui-btn-normal layui-btn-sm").text("立即参加").css({"margin-bottom": "10px", "margin-top": "10px"});
// 根据活动状态设置按钮行为<object
if (activity.status === "活动正在进行中") {
detailBtn.on("click", function() {
var editIndex = top.layer.open({
type:2,
title:"活动详情",
area:['1000px','700px'],
skin: 'layui-layer-molv',
closeBtn: 2, //关闭图标风格二
anim: 'slideUp',//从下边缘往上
shadeClose: true,
btn: [ '关闭'], //只是为了演示
success: function(){layer.closeAll()},
content:ctx+"/act/actDetail/"+activity.ac_id
});
});
// 如果活动人数小于已参与人数则点击立即参加可以正常填写信息参加活动，如果活动人数等于已参与人数则点击立即参加按钮会出现提示该活动已满请查看其他活动
if (activity.participantCount > 0) {
joinBtn.on("click", function() {
window.location.href = join.jsp+ac_id;
// var editIndex = top.layer.open({
// type:2,
// title:"填写参加信息",
// area:['900px','500px'],
// skin: 'layui-layer-molv',
// closeBtn: 2,
// anim: 'slideUp',
// shadeClose: true,
// btn: [ '关闭'],
// success: function(){layer.closeAll()},
// content:ctx+"/act/join/"+activity.ac_id
// });
});
} else if (activity.participantCount == 0){
joinBtn.on("click", function() {
layer.msg("该活动已满，请查看其他活动！");
});
joinBtn.addClass("layui-btn-disabled");
}
} else if (activity.status === "活动正在预热中") {
detailBtn.on("click", function() {
var editIndex = top.layer.open({
type:2,
title:"活动详情",
area:['900px','700px'],
skin: 'layui-layer-molv',
closeBtn: 2, //关闭图标风格二
anim: 'slideUp',//从下边缘往上
shadeClose: true,
btn: [ '关闭'], //只是为了演示
success: function(){layer.closeAll()},
content:ctx+"/act/actDetail/"+activity.ac_id //controller中只是跳转jsp 所以这里不用success判断
});
});
joinBtn.on("click", function() {
layer.msg("该活动还未开启，敬请期待!");
});
joinBtn.addClass("layui-btn-disabled");
} else if (activity.status === "活动已结束") {
detailBtn.on("click", function() {
var editIndex = top.layer.open({
type:2,
title:"活动详情",
area:['1000px','700px'],
skin: 'layui-layer-molv',
closeBtn: 2, //关闭图标风格二
anim: 'slideUp',//从下边缘往上
shadeClose: true,
btn: [ '关闭'], //只是为了演示
success: function(){layer.closeAll()},
content:ctx+"/act/actDetail/"+activity.ac_id //controller中只是跳转jsp 所以这里不用success判断
});
});
joinBtn.on("click", function() {
layer.msg("该活动已结束,可查看其他类似活动哦！");
});
joinBtn.addClass("layui-btn-disabled");
}
btnGroup.append(detailBtn, joinBtn);
body.append(startTime, status, participantCount, attendedCount, btnGroup);
inner.append(header, body);
card.append(inner);
activityList.append(card);
}
initCardEffects();
}
});
function initCardEffects() {
// 设置卡片样式
$(".card-container").css({
"box-shadow": "5px 5px 5px 5px rgb(172,175,177)",
"border-radius": "1%"
});
// 设置鼠标悬停动画效果
$(".card-container").hover(function() {
$(this).addClass("hover-effect");
}, function() {
$(this).removeClass("hover-effect");
});
}
// 格式化时间
function formatTime(timestamp) {
var date = new Date(timestamp);
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
return year + '-' + month + '-' + day;
}
});
</script>
<input type="hidden" name="id" value="${activity.ac_id}"/>
<div class="layui-form-item">
<label class="layui-form-label">活动主题</label>
<div class="layui-input-inline">
<input class="layui-input" type="text" name="ac_name" id="ac_name"lay-affix="clear" autocomplete="off" required
lay-verify="required" placeholder="请填写活动主题" value="${activity.ac_name}" disabled>
</div>
</div>
