Question

我想在现有表中添加额外的行以及一些额外的计算。该表没有标题标记，它只是确定自己应用的CSS。我通过下面的代码添加了额外的标头。现在它已经两次添加标题了。该表的（编辑）代码如下所示：

<!--This code is in a <form> with the id="train_form", hence the usage in the jQuery code-->
<table class="vis" style="width: 100%">
    <tbody>
        <tr>
            <th style="width: 20%">Eenheid</th>
            <th style="min-width: 400px">Behoefte</th>
            <th>In het dorp/Totaal</th>
            <th style="width: 120px">Rekruteren</th>
            <th style="width: 80px">To Do:</th>
        </tr>

        <tr class="row_a">
            <td class="nowrap">
                <a href="#" class="unit_link" data-unit="spear">
                    <img src="image.png" style="vertical-align: middle" alt="" class="">
                    Speervechter
                </a>
            </td>
        </tr>
        <!-- There are 3 more entries here, but to not be too long I've removed them. They are not really necessary-->
        <tr>
            <td colspan="3">
            </td>
            <td>
                <input class="btn btn-recruit" style="float: inherit" type="submit" value="Rekruteren" tabindex="11">
            </td>
            <th style="width: 80px">To Do:</th>
        </tr>
    </tbody>
</table>

我的脚本添加了行<th style="width: 80px">To Do:</th>。问题是它还将它添加到最后<td>。我已经查看了很多解决方案，但他们没有帮助。它仍然在两次添加代码（见下面的截图）。

Example

我用来添加行的代码：

$(function() {
    var done = false;
    if (!done) {
        $("#train_form > .vis > tbody > tr:not(.row_a, .row_b)").one().append("<th style='width: 80px'>To Do:</th>");
        done = true;
    };
}).one();

正如您所看到的，我已尝试使用.one()方法，并且我尝试过使用bool。两者都不起作用，因为这段代码仍然提供了上图所示的表格。

为了清楚起见，我无法控制源，这是一个在线浏览器游戏的脚本。

我做错了什么？

Answer 1

我认为你想要$.first()而不是$.one()：

$("#train_form > .vis > thead > tr:not(.row_a, .row_b)")
    .first()
    .append("<th style='width: 80px'>To Do:</th>");

jQuery只执行一次.append

1 个答案: