![](https://iknow-base.cdn.bcebos.com/lxb/notice.png)
jsp页面有一个table表格,每一行最后都有一个编辑按钮,点击按钮弹出div框,并显示该行的信息,怎么做?
selectjsp,在addjsp上面有一个请选择按钮,点击请选择按钮后,弹出selectjsp页面,这个页面上是从数据库中遍历的企业,选中一条数据,点击确认,selectjsp页面关闭,并将结果带到addjsp请选择前面的文本框里面。
但name里的对象里要包含一个list,一般像你这种table的在后台肯定返回的是list集合把,所以用logic标签循环显示就行的 。
<logiciterate id这里的名字是随意 只是在下面调用而已aList name后台返回给前台的对象比如page propertylist这里必须是list因为表示循环对象是list集合类型的indexId,indx>。
<tr class=ChangeLineColor height20>。
<td align=center><%=indx+1%></td>。
<td>,aList.productCode<,td>,alist。要的字段名字。
<td>,aList.fstCustomerName<,td>。
至于你是返回的直接是一个对象包含list集合的还是直接一个list,看你自己情况,改就行的。
推荐于2017-12-16
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title> demo </title>
<meta name="Author" content="xugang" />
<script src="js/jquery.min.js"></script>
<!--必须加载jQuery文件,网上有下载-->
<script type="text/javascript">
$(function(){
// 点击按钮,DIV弹出,点击body任意地方隐藏div
$('#btn2').click(function(){
if ( event && event.stopPropagation ) {
// this code is for Mozilla and Opera
event.stopPropagation();
}
else if (window.event) {
// this code is for IE
window.event.cancelBubble = true;
}
$('#xiugai').show();
});
$('#bnt').click(function(){
var name = $('#xg_name').val();
var age = $('#xg_age').val();
$('#name').html(name);
$('#age').html(age);
$('#xiugai').hide();
});
});
</script>
<style type="text/css">
#xiugai{
position: fixed;
top: 50%;
left: 50%;
width: 240px;
height: 150px;
margin: -50px 0 0 -50px;
display: none;
border: 1px solid #666;
}
</style>
<body>
姓名:<span id="name">张三</span>
年龄:<span id="age">18</span>
<input id="btn2" type="button" value="修改" />
<div id="xiugai">
姓名:<input id="xg_name" type="text"/>
年龄:<input id="xg_age" type="text"/>
<input id="bnt" type="button" value="修改" />
</div>
</body>
</html>
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<table id="tabId"width="900" border="1" cellspacing="0">
<tr>
<td>学号</td>
<td>姓名</td>
<td>性别</td>
<td>年龄</td>
<td>操作</td>
</tr>
<tr>
<td>110</td>
<td>张三</td>
<td>女</td>
<td>20</td>
<td><input type="button" value="弹" onclick="getRowValue(this)"/></td>
</tr>
<tr>
<td>112
</td>
<td>里斯</td>
<td>男</td>
<td>19</td>
<td><input type="button" value="弹" onclick="getRowValue(this)"/></td>
</tr>
<tr>
<td>113
</td>
<td>王五</td>
<td>男</td>
<td>30</td>
<td><input type="button" value="弹"onclick="getRowValue(this)"/></td>
</tr>
</table>
<div id="divId" align="center" style="width:580px;height:160px;display:none;border:1px solid black ;" title="提升度阈值">
<table >
<tr>
<td>学号:</td>
<td>
<input type="text" id="id" style="width:160px"></input>
</td>
</tr>
<tr>
<td>姓名:</td>
<td>
<input type="text" id="name" style="width:160px"></input>
</td>
</tr>
<tr>
<td>性别:</td>
<td >
<input type="text" id="sex" style="width:160px"></input>
</td>
</tr>
<tr>
<td>年龄:</td>
<td>
<input type="text" id="age" style="width:160px"></input>
</td>
</tr>
</table>
<br>
<div align="center">
<input type="button" value="关闭" onclick="closeDiv()">
</div>
</div>
</body>
</html>
<script type="text/javascript">
//上面穿的this值得就是input
function getRowValue(element){
//设置div显示
document.getElementById("divId").style.display="";
//this做为参数传过来是方法中的element,parentNode就是获取父节点,获取了连个父节点,就相当于获取了tr
var node = element.parentNode.parentNode;
//给每一个input框赋值,node.children[0].innerHTML,node就是tr,tr的子类有多个【0】根据下标取值
document.getElementById("id").value=node.children[0].innerHTML;
document.getElementById("name").value=node.children[1].innerHTML;
document.getElementById("sex").value=node.children[2].innerHTML
document.getElementById("age").value=node.children[3].innerHTML;
}
function closeDiv(){
//设置div关闭
document.getElementById("divId").style.display="none";
}
</script>
如果是输出到select而不是input呢?
select拿到值后循环判断,相等就让check等于true div中的自然就是table中的值了