//初始状态对指标进行赋值
$(document).ready(function(){
<c:forEach items="${details}" var="item">
var indicatorId = "${item.indicatorId}";
var indicatorName = "${item.indicatorName}";
var indicatorWeight = "${item.indicatorWeight}";
var indicatorLevel = "${item.indicatorLevel}";
var parentIndicatorId = "${item.parentIndicatorId}";
//取得table对象
// var tabObj = document.getElementById("tableId");
var indicatorDivs=$("#indicatorDivs").find("tbody");
var tabObj=indicatorDivs[0];
var cloneRow = document.getElementById("clonetr");
//循环 向table增加新行
//var newRow = tabObj.insertRow(rowCount++);
var newRow= cloneRow.cloneNode();
tabObj.appendChild(newRow);
//每行的新列值
newRow.insertCell(0).innerHTML=indicatorId;
newRow.insertCell(1).innerHTML=indicatorName;
newRow.insertCell(2).innerHTML=indicatorWeight;
newRow.insertCell(3).innerHTML=indicatorLevel;
newRow.insertCell(4).innerHTML=parentIndicatorId;
newRow.insertCell(5).innerHTML="<a class='btnDel'>删除</a>";
newRow.cells[5].onclick = function(){
//删除行
deleteIndicator(this.parentNode.firstChild.innerHTML);
var indicators=$("#indicatorDivs").find("tbody");
var tabObj=indicators[0];
tabObj.rows[this.parentNode.rowIndex].remove();
};
newRow.style.visibility="visible";
</c:forEach>
});
此处有一个问题就是,无法将删除事件加上,原因:写入table 行比较慢,只需要加载所有的DOM结构,在浏览器把所有的HTML放入DOM tree之前就执行js效果。包括在加载外部图片和资源之前,即,dom加载在前,而窗体加载在ready事件之后。
这事件是加在单元格的,理论上点击链接是会冒泡的,把事件加到链接试试吧,你的代码是在单元格上
经过高人指点之后,修改如下即可。
//初始状态对指标进行赋值
$(document).ready(function(){
//对修改页面指标信息进行填充
<c:forEach items="${details}" var="item">
var indicatorId = "${item.indicatorId}";
var indicatorName = "${item.indicatorName}";
var indicatorWeight = "${item.indicatorWeight}";
var indicatorLevel = "${item.indicatorLevel}";
var parentIndicatorId = "${item.parentIndicatorId}";
var indicatorDivs=$("#indicatorDivs").find("tbody");
var tabObj=indicatorDivs[0];
var cloneRow = document.getElementById("clonetr");
//循环 向table增加新行
var newRow= cloneRow.cloneNode();
tabObj.appendChild(newRow);
//每行的新列值
newRow.insertCell(0).innerHTML=indicatorId;
newRow.insertCell(1).innerHTML=indicatorName;
newRow.insertCell(2).innerHTML=indicatorWeight;
newRow.insertCell(3).innerHTML=indicatorLevel;
newRow.insertCell(4).innerHTML=parentIndicatorId;
newRow.insertCell(5).innerHTML="<a class='btnDel' href='javascript:addDelete(\""+indicatorId+"\");'>删除</a>";
newRow.style.visibility="visible";
</c:forEach>
});
//为href增加删除事件
function addDelete(indicatorId){
var index = 1000;//存储所在行索引
deleteIndicator(indicatorId); //后台删除
var tabObj = document.getElementById("tbodyId");
var len = tabObj.rows.length;
//获取指标所在行索引
for(var i=0;i<len;i++){
if(indicatorId==tabObj.children[i].cells[0].textContent){
index = i;
break;
}
}
tabObj.rows[index].remove();//前台删除
}
由于无法传参,最后使用转义字符完成,又学习到一点小知识。