如何在表格行中动态附加链接

问题描述

需要在 td 单元格内附加带有按钮的行。 这是我的代码：

$('#contact_table').find('tbody').append(
                "<tr><td>--</td><td>"+key+"</td><td>"+value+'</td><td><a cal-id=cal-clear class="badge badge-outline-secondary" href="javascript:;"><i class="ti-trash p-1"> </i> delete</a></td></tr>');

看过 Ben Davidow 的类似问题，我的代码具有类似的结构，但 button('') 没有出现在表格中。控制台没有错误。为什么它不能正常工作？

解决方法

我发现了一个问题，即您的 html 字符串以双引号开头并以单引号结尾，但不能总结。
无论如何，我已经修改了您的代码以使用插值并使其更具可读性。

请看。

const key="key";
const value="value";

$('#contact_table tbody').append(`
    <tr>
        <td>--</td>
        <td>${key}</td>
        <td>${value}</td>
        <td>
            <a cal-id=cal-clear class="badge badge-outline-secondary" href="javascript:;">
                <i class="ti-trash p-1"> </i> delete
            </a>
        </td>
    </tr>
`);

,

已发现问题，此附加行的代码必须工作两次 $('tr').click AND $("#add_knt" ).click，我在 #add_knt 中进行了更改，但忘记对 1 个案例执行相同操作并且只测试第一种情况（从 ajax 上传）。