有没有大神能提供一下，删除单元行，数字会自动按顺序排列的思路？例如我删掉第三行，后面的数字由4 5变成3 4
xh001
xh002
xh003
xh004
xh005
我现在删掉第三行，后面两行自动变成
xh003
xh004
还有一个问题，如果数据多了，有两位数 三位数的人数，好像更难了。
不一定要把代码写出来，提供具体的思路就行。
风起临冬
2018-08-04
2 回答
function del(x){
var table=document.getElementById("table");
var tr=x.parentNode.parentNode;
var message=confirm("确认删除？");
if(message==true){
tr.parentNode.removeChild(tr);
}
/*每点一次删除，tr的第一第二个子节点都会变成新值*/
/*即 学号和姓名随着每一次删除，会变成"xh"+当前tr在table的索引值，于是就能自动保持连续的1234了*/
var u=document.getElementsByTagName("tr");
for(var i=1;i<u.length;i++){
var num=table.indexOf(u[i])
u[i]=new Array();
u[i][0]=u[i].childNodes[0];
u[i][1]=u[i].childNodes[1];
u[i][0].innerHTML="xh00"+num;
u[i][1].innerHTML="第"+num+"个学生";
}
}我在删除的函数里加了点东西，每次删除都能更新一下学号和姓名，这样写个人感觉逻辑没有问题，但是却没有用。
下面，我会把整个代码发出来。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>table</title>
<script type="text/javascript">
window.onLoad=function(){
var tr=document.getElementById("table").childNodes;
for(var i=0;i<tr.length;i++){
onMounse(tr[i]);
}
}
function onMounse(x){
x.onmouseover=function(){
x.style.backgroundColor="#f2f2f2";
}
x.onmouseout=function(){
x.style.backgroundColor="#fff";
}
}
function add(){
var num=document.getElementById("table").childNodes.length+1
var x=document.createElement("tr");
var y=document.createElement("td");
var z=document.createElement("td");
var m=document.createElement("td");
y.innerHTML="xh00"+num;
z.innerHTML="第"+num+"个学生";
m.innerHTML="<a href='javascript:;' onclick='del(this)'>删除</a>";
x.align="center";
x.appendChild(y);
x.appendChild(z);
x.appendChild(m);
document.getElementById("table").appendChild(x)
}
function del(x){
var table=document.getElementById("table");
var tr=x.parentNode.parentNode;
var message=confirm("确认删除？");
if(message==true){
tr.parentNode.removeChild(tr);
}
/*每点一次删除，tr的第一第二个子节点都会变成新值*/
/*即 学号和姓名随着每一次删除，会变成"xh"+当前tr的索引值，于是就能自动保持连续的1234了*/
var u=document.getElementsByTagName("tr");
for(var i=1;i<u.length;i++){
var num=table.indexOf(u[i])
u[i]=new Array();
u[i][0]=u[i].childNodes[0];
u[i][1]=u[i].childNodes[1];
u[i][0].innerHTML="xh00"+num;
u[i][1].innerHTML="第"+num+"个学生";
}
}
</script>
</head>
<body>
<table border="1" width="50%" id="table">
<tr align="center">
<td>学号</td>
<td>姓名</td>
<td>操作</td>
<tr align="center">
<td>xh001</td>
<td>王小明</td>
<td><a href="javascript:;" onclick="del(this)">删除</a>
<tr align="center">
<td>xh002</td>
<td>刘小芳</td>
<td><a href="javascript:;" onclick="del(this)">删除</a>
</table>
<form>
<input type="button" value="添加一行" onclick="add()">
</form>
</body>
</html>举报
0/150
提交
取消
