forEach遍历按钮绑定事件

最新推荐文章于 2021-10-20 12:12:36 发布

我只是一只小白~

最新推荐文章于 2021-10-20 12:12:36 发布

阅读量4.1k

点赞数

CC 4.0 BY-SA版权

分类专栏：崩溃的我

本文链接：https://blog.youkuaiyun.com/W_qwahaha/article/details/85708188

崩溃的我专栏收录该内容

12 篇文章

订阅专栏

这篇博客讲述了如何在使用forEach循环时，为每个生成的按钮元素绑定唯一的ID，并详细说明了在JSP和JS中如何实现这一操作，包括在JSP中设置onclick事件以及在JS中动态修改元素内容。

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

通过C标签forEach迭代出来的按钮等都需要绑定唯一id（代码中acid）
在这里插入图片描述

jsp:
οnclick="AddTogo(${activity.acid});"

<c:forEach items="${activitylist}" var="activity">
	<c:if test="${activity.stdid!=sessionScope.student.stdid}">
				<div class="about-button" style="text-align: right">
					<a class="btn btn-xlarge btn-clean-one" id="addtogo"
						onclick="AddTogo(${activity.acid});">我要去</a>
				</div>
	</c:if>
</c:forEach>

js : 给按钮绑定事件同时绑定唯一ID，acid
$("#Aspan"+acid).empty();
$("#togospan"+acid).append(togospan);

function AddTogo(acid) {
	$("#Aspan"+acid).empty();
	var stdid = $("#stdid").val();
	var stdname = $("#stdname").val();
	$.ajax( {
		url : "AddTogo.action",
		type : "post",
		data : {
			"acid" : acid,
			"stdid" : stdid,
			"stdname" : stdname
		},
		success : function(data) {
			var togospan = "";
			if (data != null && data.length > 0) {
				for ( var i = 0; i < data.length; i++) {
					togospan = "<span>" + data[i].stdname
							+ "</span>&nbsp&nbsp&nbsp";
					$("#togospan"+acid).append(togospan);
				}
			} else {
				togospan = "<span>无</span>";
				$("#togospan"+acid).append(togospan);
			}
		},
		dataType : "json"
	});

}

jsp : jsp也一样
id="togospan${activity.acid}"

<div id="togospan${activity.acid}">
					响应人:
			<span id = "Aspan${activity.acid}">
					<c:set var="flag" value = "0"></c:set>
						<c:forEach items="${togolist}" var="togo">
							<c:if test="${togolist.size()>0}">
								<c:if test="${activity.acid==togo.acid}">
									${togo.stdname}&nbsp;&nbsp;
									<c:set var="flag" value="1"></c:set>
								</c:if>
						</c:if>
					</c:forEach>
					<c:if test="${flag eq 0}">
							暂无 , 快点击响应吧  !
					</c:if>
			</span>
	</div>