jsp实现将选中的多选框的table列动态加载到另一个页面特定位置或者特定table里面

                        jsp实现将选中的多选框的table列动态加载到另一个页面特定位置或者特定table里面

 

1. 页面代码，后台获取的数据，将每一行的字段值赋予checkbox的attr1......9,

   <table width="99%" border="0" cellpadding="0" cellspacing="1" class="biaocss3"  id="table1" align="center">
   			<tr>
   				<th nowrap class="tdTitle" align="center" ><input type="checkbox" id="selectAll" onclick="selectAllClick()">全选</th>
   				<th nowrap class="tdTitle" align="center" >销售方式</th>
   				<th nowrap class="tdTitle" align="center" >商品编号</th>
   				<th nowrap class="tdTitle" align="center" >商品名称</th>
   				<th nowrap class="tdTitle" align="center" >商品所属分类</th>
   				<th nowrap class="tdTitle" align="center" >店铺编号</th>
   				<th nowrap class="tdTitle" align="center" >店铺名称</th>
   				<th nowrap class="tdTitle" align="center" >所属机构</th>
   				<th nowrap class="tdTitle" align="center" >商品状态</th>
   				<th nowrap class="tdTitle" align="center" >上下架时间</th>
   			</tr>
   			<c:if test="${empty List }">
   				<tr>
   					<td colspan="13" style="color: red;">
   						<b style="float: left;">未查询到记录</b>
   					</td>
   				</tr>
   			</c:if>
   			<c:forEach items="${List}" var="row" varStatus="status">
   				<tr>
   					<td><input type="checkbox" class="adviceSeq" value="${row.id }"attr1="${row.Sale}" attr2="${row.iNo}"attr3="${row.Name }" attr4="${row.ProdCat}" attr5="${row.number }" attr6="${row.ShopName }" attr7="${row.orgName }" attr8="${row.MdseStatus }" attr9="${row.OnShelfTime }" ></td>
   					<td>${row.Sale}</td>
   					<td>${row.iNo }</td>
   					<td>${row.Name }</td>
   					<td>${row.ProdCat}</td>
   					<td>${row.number }</td>
   					<td>${row.ShopName }</td>
   					<td>${row.orgName }</td>
   					<td>${row.MdseStatus}</td>
   					<td><fmt:formatDate value="${row.OnShelfTime }" pattern="yyyy-MM-dd HH:mm:ss"/></td>
   					
   				</tr>
   			</c:forEach>
   		</table>
   		<table width="99%" border="0" cellspacing="0" cellpadding="0">
   			<tr>
   				<td align="center">
   					 <input type="button" name="closeButton" class="anniucss" value="确定" onclick="selectIt()">
   				</td>
   			</tr>
   		</table>
   		
   
   		
   		<table width="99%" border="0" cellpadding="0" cellspacing="1" class="biaocss3 " id="showMdseList" align="center" >
   					
   					<tr>
   						<th nowrap class="tdTitle" align="center" >销售方式</th>
   						<th nowrap class="tdTitle" align="center" >商品编号</th>
   						<th nowrap class="tdTitle" align="center" >商品名称</th>
   						<th nowrap class="tdTitle" align="center" >商品所属分类</th>
   						<th nowrap class="tdTitle" align="center" >店铺编号</th>
   						<th nowrap class="tdTitle" align="center" >店铺名称</th>
   						<th nowrap class="tdTitle" align="center" >所属机构</th>
   						<th nowrap class="tdTitle" align="center" >商品状态</th>
   						<th nowrap class="tdTitle" align="center" >上下架时间</th>
   						<th nowrap class="tdTitle" align="center" >操作</th>
   					</tr>
   				
   </table>

    

2 .js实现方法：

function selectIt(){
	var Cm = $(".adviceSeq:checked:enabled");
	
	var str = "";
	
	//循环编列选中的所有行，把值赋予每一行对应的tr和td
	for(var i = 0 ; i < Cm.length ; i++){
		
		str = str.concat("<tr name ='tableTD' class='tableTr' attr='"+Cm[i].getAttribute("attr2")+"'><td class='selectedAdvertis' value='"+Cm[i].value+"'>"+Cm[i].getAttribute("attr1")+"</td><td name='tableTD'>"+Cm[i].getAttribute("attr2")+"</td><td>"+Cm[i].getAttribute("attr3")+"</td><td>"+Cm[i].getAttribute("attr4")+"</td><td>"+Cm[i].getAttribute("attr5")+"</td><td>"+Cm[i].getAttribute("attr6")+"</td><td>"+Cm[i].getAttribute("attr7")+"</td><td>"+Cm[i].getAttribute("attr8")+"</td><td>"+Cm[i].getAttribute("attr9")+"</td><td><a href='javaScript:void(0)' onclick='delTd(this)'>删除</a>&nbsp;<a href='javaScript:void(0)' data-reveal-id='myModals' data-animation='fade' onclick='detailIt1(\""+Cm[i].getAttribute("attr3")+"\")'>详情</a></td></tr>");
	}
	
	$("#showMdseList").append(str);/、把动态生成的tr加到id为showMdseList的table里面
	
}