如果文本为NA，则删除动态加载的工具提示表tr

Question

删除动态加载的工具提示表tr

我有图表，所以每个图表栏都有工具提示，显示前一个栏值和当前悬停栏值，所以如果td中的文本NA，我想隐藏tr。我已经完成了下面的代码，但它不工作

<div class="customTooltipRapsure">
<div class="scrollingTooltip">
<table id="tooltipTable">
<tbody>
<tr class="OldGrossBudget">
<td>Old Gross Budget </td>
<td>NA</td>
</tr>
<tr class="NewGrossBudget">
<td>New Gross Budget </td>
<td class="text-right">9,964.72</td></tr>
</tbody>
</table>
</div>
</div>
$(document).ready(function () {
$(".customTooltipRapsure #tooltipTable tbody tr td").filter(function () {
return $(this).text() === "NA";
}).closest("tr").remove();
});

Answer 1

您可以使用javascript 删除NA td

function removeTR(){
var tableToolTip = document.getElementById('tooltipTable');
const table = document.getElementById('tooltipTable').getElementsByTagName('tr');
for (let x = 0; x < table.length; x++) {
const row = table[x];
const tds= row.getElementsByTagName("td");
for (let y = 0; y < tds.length; y++) {
if (tds[y].innerText == "NA") {
table[x].remove();
break;
}
}
}
}
removeTR();

<div class="customTooltipRapsure">
<div class="scrollingTooltip">
<table id="tooltipTable">
<tbody>
<tr class="OldGrossBudget">
<td>Old Gross Budget </td>
<td>NA</td>
</tr>
<tr class="NewGrossBudget">
<td>New Gross Budget </td>
<td class="text-right">9,964.72</td></tr>
</tbody>
</table>
</div>
</div>

Answer 2

我不确定是否使用过滤器来查找带文本的列"NA"，所以我用了另一种方法

const table = $("#tooltipTable tbody tr")
for (let x = 0; x < table.length; x++) {
const row = $("#tooltipTable tbody").find(`tr:eq(${x})`)
for (let y = 0; y < row.find("td").length; y++) {
if (row.find(`td:eq(${y})`).text() == "NA") {
row.find(`td:eq(${y})`).closest("tr").remove();
}
}
}

table {
border: solid 2px black;
}
td {
border: solid 1px black;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="customTooltipRapsure">
<div class="scrollingTooltip">
<table id="tooltipTable">
<tbody>
<tr class="OldGrossBudget">
<td>Old Gross Budget </td>
<td>NA</td>
</tr>
<tr class="NewGrossBudget">
<td>New Gross Budget </td>
<td class="text-right">9,964.72</td>
</tr>
</tbody>
</table>
</div>
</div>

首先需要循环total行，然后循环total列，最后找到带文本的列"NA"；希望这能解决你的问题