jQuery如何为单击的每个新div添加表行？

我正在尝试为每个单击的

div

创建一个新的

表

行，并为每个

div

创建一行，因此在同一

div

上单击两次不会创建两行

HTML

<div class="block div1"></div>
<div class="block div2"></div>
<div>
    <table class="block table" border="1">
        <thead>
            <tr>
                <th>Number</th>
                <th>Heading</th>
            </tr>
        </thead>
        <tbody class="body">
        </tbody>
    </table>
</div>

数
标题

Javascript

$('block').on('click', function () {
    $('table.body').append('<tr><td></td> <td></td></tr>');
});

$（'block'）。在（'click'，函数（）{
$（'table.body'）。追加（“”）；
});

$（'.block'）。在（'click'，函数（）{
$（'table.body'）。追加（“”）；
});

---

您忘记了块中的“.”而使用了“table.body”而不是“table.body”

通过表中的类，您实际上是想这样做的：

$（'.block'）。在（'click'，函数（）{
$（'.table.body'）。追加（''）；
});

除了修复不正确的选择器外，要使每个绑定目标只触发一次事件，您可以使用jQuery的

.one（）

方法，而不是

.on（）

方法，如下所示：

$('.block').one('click', function () {
    $('table .body').append('<tr><td></td><td></td></tr>');
});

$（'.block'）。一（'click'，函数（）{
$（'table.body'）。追加（“”）；
});

然后，此单击事件将对其绑定到的每个元素最多触发一次

---

您的示例完全不完整请在您的问题中包含您的代码（我们不需要CSS）。

$('.block').on('click', function () {
        $('.table .body').append('<tr><td></td> <td></td></tr>');
});

$('.block').one('click', function () {
    $('table .body').append('<tr><td></td><td></td></tr>');
});