Question

我想使用forloop来换行数据（不是连续），当我点击按钮时，清除最后的数据（但保留原始标题 - id.lat.lng.speed。 rpm.angle.state.time）。额外的，我在行后面发现2个字段都没有任何数据。（为什么？我可以将其删除吗？）

enter image description here

<!DOCTYPE html>
<%@ page language="java" contentType="text/html;charset=utf-8" import="java.io.*" import="java.util.*" import="java.sql.*"%> 
<html>
<head>
<script>
function click_x(clicked_id){
var xxx=[];
    xxx[0] = [0,1,2,3,4,5,6,7];
    xxx[1] = [8,9,10,11,12,13,14,15];
    xxx[2] = [16,17,18,19,20,21,22,23];
    xxx[3] = [24,25,26,27,28,29,30,31];
    xxx[4] = [32,33,34,35,36,37,38,39];
    xxx[5] = [40,41,42,43,44,45,46,47];

    var table = document.getElementById("myTable");
    var row1 = table.insertRow(1);
    var cell1 = row1.insertCell(0);
    var markersControlArray = [true,true,true,false,false];

    for(var k = 0 ; k < markersControlArray.length ; k++){
        if(markersControlArray[k] == true){
            for(var i = 0; i < 8 ; i++){
                cell1 = row1.insertCell(i);
                cell1.innerHTML = xxx[k][i];
            }
        }
    }
}
</script>
</head>
<body>
<table id="myTable" border="3">
                <tr>
                 <th>Id</th>
                 <th>Lat</th>
                 <th>Lng</th>
                 <th>Speed</th>
                 <th>Rpm</th>
                 <th>Angle</th>
                 <th>State</th>
                 <th>Time</th>
                </tr>
</table><br>
<button id="1" onClick="click_x(this.id)">Submit</button>   
</body>
</html>

Answer 1

您需要的是使用xxx[k]方法为每个insertRow在表格中插入新行。你应该在外部for循环的开头做它。所以循环看起来应该是这样的：

for(var k = 0 ; k < markersControlArray.length ; k++){
    if(markersControlArray[k] == true){
        var row1 = table.insertRow(-1);
        for(var i = 0; i < 8 ; i++){
            var cell1 = row1.insertCell(i);
            cell1.innerHTML = xxx[k][i];
        }
    }
}

那些空单元格在那里，因为你在循环之前创建它们，使用以下代码：

var cell1 = row1.insertCell(0);
var cell2 = row1.insertCell(1);

整个JavaScript代码：

function click_x(clicked_id){
var xxx=[];
    xxx[0] = [0,1,2,3,4,5,6,7];
    xxx[1] = [8,9,10,11,12,13,14,15];
    xxx[2] = [16,17,18,19,20,21,22,23];
    xxx[3] = [24,25,26,27,28,29,30,31];
    xxx[4] = [32,33,34,35,36,37,38,39];
    xxx[5] = [40,41,42,43,44,45,46,47];

    var table = document.getElementById("myTable");
    var markersControlArray = [true,true,true,false,false,true]; // you have missed value for xxx[5] - I added it

    for(var k = 0 ; k < markersControlArray.length ; k++){
        if(markersControlArray[k] == true){
            var row1 = table.insertRow(-1);
            for(var i = 0; i < 8 ; i++){
                var cell1 = row1.insertCell(i);
                cell1.innerHTML = xxx[k][i];
            }
        }
    }
}

检查working fiddle。

总的来说，我发现你已经使用了一些教程中的代码并且没有对它进行足够好的分析并且没有删除不需要的代码。

Answer 2

<!DOCTYPE html>
<html>
<head>
<script>

function arrRow(tableId){
    var table = document.getElementById(tableId);
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);    
    return row;
}

function click_x(clicked_id){
var xxx=[];
    xxx[0] = [0,1,2,3,4,5,6,7];
    xxx[1] = [8,9,10,11,12,13,14,15];
    xxx[2] = [16,17,18,19,20,21,22,23];
    xxx[3] = [24,25,26,27,28,29,30,31];
    xxx[4] = [32,33,34,35,36,37,38,39];
    xxx[5] = [40,41,42,43,44,45,46,47];

    var table = document.getElementById("myTable");

    var markersControlArray = [true,true,true,false,false];

    for(var k = 0 ; k < markersControlArray.length ; k++){
        if(markersControlArray[k] == true){
            var RowVar = arrRow("myTable");
            for(var i = 0; i < 8 ; i++){
                cell1 = RowVar.insertCell(i);
                cell1.innerHTML = xxx[k][i];
            }

        }
    }
}
</script>
</head>
<body>
<table id="myTable" border="3">
                <tr>
                 <th>Id</th>
                 <th>Lat</th>
                 <th>Lng</th>
                 <th>Speed</th>
                 <th>Rpm</th>
                 <th>Angle</th>
                 <th>State</th>
                 <th>Time</th>
                </tr>
</table><br>
<button id="1" onClick="click_x(this.id)">Submit</button>   
</body>
</html>

如何使用for循环来换行表并清除数据？

2 个答案: