如何清除表中不需要的td

Question

我在这里有一个愚蠢的问题。 我正在使用bootstrap.min.js将数据显示到表格中。 但它在我的最后一行显示了不需要的td。我如何清除显示在表格最后一行的不需要的td？

任何人对我的问题都有任何答案吗？请帮我解决这个问题。

这是我显示数据或创建表格的代码

script type="text/javascript">
  $(document).ready(function(){
	
    $('#submit-file').on("click",function(e){
		e.preventDefault();
		$('#files').parse({
			config: {
				delimiter: "",
				complete: displayHTMLTable,
			},
			before: function(file, inputElem)
			{
				//console.log("Parsing file...", file);
			},
			error: function(err, file)
			{
				//console.log("ERROR:", err, file);
			},
			complete: function()
			{
				//console.log("Done with all files");
			}
		});
    });
	
	function displayHTMLTable(results){
		var table = "<table class='table table-bordered'>";
		var data = results.data;
		 
		for(i=0;i<data.length;i++){
			table+= "<tr>";
			var row = data[i];	
			var cells = row.join(",").split(",");
			for(j=0;j<cells.length;j++){
				table+= "<td>";
				table+= cells[j];
				table+= "</td>";
			}
			table+= "</tr>";
		}
		table+= "</table>";
		$("#parsed_csv_list").html(table);
	}
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/4.1.2/papaparse.js"></script>

<div class="container" style="padding:5px 5px; margin-left:5px">
	<div class="well" style="width:70%">
		<div class="row">
		<form class="form-inline">
			<div class="form-group">
			  <label for="files">Upload File Data :</label>
			  <input type="file" id="files"  class="form-control" accept=".csv" required />
			</div>
			<div class="form-group">
			 <button type="submit" id="submit-file" class="btn btn-primary">Upload File</button>
			 </div>
		</form>
		</div>
		<div class="row">
			
			<div id="parsed_csv_list" class="panel-body table-responsive" style="width:800px">
			</div>
		</div>
	</div>
	<div id="footer"></div>
  </div>

这是不受欢迎的tr and td showing

这是我用检查元素检查时得到的

我尝试将代码编辑到此

function displayHTMLTable(results){
		var table = "<table class='table table-bordered'>";
		var data = results.data;

		for(i=0;i<=data.length;i++){
			if(data[i].trim().length > 1)// check added here
            { 
			table+= "<tr>";
			var row = data[i];	
			var cells = row.join(",").split(",");
			for(j=0;j<cells.length;j++){
				table+= "<td>";
				table+= cells[j];
				table+= "</td>";
			}
			table+= "</tr>";
			}
			else {
			}
		}
		table+= "</table>";
		$("#parsed_csv_list").html(table);
	}	
  });

Answer 1

您需要检查您拥有的列数：

function displayHTMLTable(results){
    var table = "<table class='table table-bordered'>";
    var data = results.data;

    var size = -1;
    for(i=0;i<data.length;i++){
        var row = data[i];  
        var cells = row.join(",").split(",");
        if (cells.length < size) continue;
        else if (cells.length >  size) size = cells.length;
        table+= "<tr>";
        for(j=0;j<cells.length;j++){
            table+= "<td>";
            table+= cells[j];
            table+= "</td>";
        }
        table+= "</tr>";
    }
    table+= "</table>";
    $("#parsed_csv_list").html(table);
}