jquery append 不工作但在另一个函数中工作答案

【问题标题】：jquery append not working but working in another functionjquery append 不工作但在另一个函数中工作
【发布时间】：2017-12-15 14:28:48
【问题描述】：

所以.. 我有 2 个 jquery 函数可以将某些内容附加到表中。第一个不起作用，第二个功能起作用吗？在第一个函数中，我的 HTML var 填充了要附加的好信息，但它只是不附加它？？

function buildTable(data) {
   var html = "";
   $.each(data, function (key, value) {
       html += "<tr>";
       html += "<td><a class='delete'><i class='fa fa-thrash'></i></a></td>";
       html += "<td class='key'>" + key + "</td>";
       html += "<td class='val'>" + value + "</td>";
       html += "<td></td>";
       html += "</tr>";
       //$(".table > tbody").prepend(html);
       //$(".addrow").append(html);
       //$("#parameterTable > tbody").append(html);
   });
   $('.addrow').prepend(html);

   //$(".formTable ").prepend(html);

}

第二个功能（起作用的那个）

function addNewParameter() {
   if(!added) {
       var html = "<tr>";
        html += "<td></td>";
        html += "<td><input type='text' class='parameter1' name='Parameter1'></td>";
        html += "<td><input type='text' class='parameter2' name='Parameter2'></td>";
        html += "<td><a class='save'><i class='fa fa-save'></i></a><a class='undoAdd'><i class='fa fa-undo'></i></a></td>";
        html += "</tr>";
        $(".addrow").append(html);
        added = true;
   } else {
       showWarning("u heeft al een parameter toegevoegd, sla deze eerst op.");

   }

}

我需要附加的 HTML

<table class="formTable table table-striped table-bordered table-hover dataTable" id="parameterTable">
    <thead>
        <tr>
            <td class="col-md-2"></td>
            <td class="col-md-4">
                Naam
            </td>
            <td class="col-md-4">
                Waarde
            </td>
            <td class="col-md-2"></td>
        </tr>
    </thead>
    <tbody class="addrow">

    </tbody>
</table>

我已经为此苦苦挣扎了一段时间，任何帮助都会很好

【问题讨论】：

你可以使用.prepend() 和.append()。
是的，我都试过了，它们都不起作用
我认为您的问题是，在非工作情况下，您正在构建一个 list 容器元素（<tr> 元素）以追加（嗯，预先)。您最好将所有这些行包装在<tbody> 中，然后将整个<tbody> 附加到现有行之后。（一个表格可以有任意数量的<tbody> 元素。）
你能确认“数据”中有什么东西吗？此外，您正在构建一个列表 - 而不是一个要附加//前置的 html 节点。尝试将您的 prepend 放入循环中并每次清除 html 字符串。
另一种可行的方法是为.prepend() 或.append() 提供一个由<tr> 元素组成的数组。然而，根据我的经验，将行附加到表中是旧 IE 版本根本不会做的事情，<tbody> 包装器方法是唯一对我可靠的方法。

标签： javascript jquery html ajax asp.net-ajax

【解决方案1】：

你试过这样吗？

function buildTable(data) {
       var html = "";
       $.each(data, function (key, value) {
           html += "<tr>";
           html += "<td><a class='delete'><i class='fa fa-thrash'></i></a></td>";
           html += "<td class='key'>" + key + "</td>";
           html += "<td class='val'>" + value + "</td>";
           html += "<td></td>";
           html += "</tr>";
       });
       $('.addrow').append(html);

    }

【讨论】：

是的 :( 我确实尝试过这个 html var 填充正确，它只是没有填充它

【解决方案2】：

正确使用jQuery不需要结束标签：

function addNewParameter() {
    if (!added) {
        var newHtml = $('<tr>');
        newHtml.append($('<td>'));
        newHtml.append(
            $('<td>').append(
                $('<input>'.addClass("parameter1").attr({"name":"Parameter1","type":"text"}))
                )
        );
        html.append(
            $('<td>').append(
                $('<input>').addClass("parameter2").attr({"name":"Parameter2","type":"text"})
            )
        );

        html.append(
            $('<td>').append(
                $('<a>').addClass('save').append(
                    $('<i>').addClass("fa fa-save")
                ),
                $('<a>').addClass('undoAdd').append(
                    $('<i>').addClass("fa fa-undo")
                    )
                )
            );
        $('.addrow').append(newHtml);
        added=true;
        }
        else {
        showWarning("u heeft al een parameter toegevoegd, sla deze eerst op.");
        }

}

【讨论】：

【解决方案3】：

这是一个引导对话框的问题，在加载对话框然后附加功能起作用后

【讨论】：