javascript - 限制点击数据表元素

Question

我有一个数据表，我正在打印从数据库中获得的查询结果，该表的一般外观如下:

<table  id="dt-inventory-list" class="table table-responsive">
    <thead>
        <tr>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>Field</th>
            <th>ACTION</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

现在，如您所见，有一个名为 ACTION 的列，在这一行中，我按程序添加了一个“a”标签，以便用户可以将此信息添加到另一个数据表中，我在 AJAX 数据源中执行此操作:

inventory.action = '<a data-id="'+inventory.idInventory+'" onclick="addRow('+inventory.idInventory+')" ondblclick="return false" title="Add"><i class="fa fa-lg fa-fw fa-plus-circle"></i></a>';

我确实有验证阻止它添加项目两次，我的问题是当用户双击这个“a”标签时速度太快，它会跳过验证并添加两次。有没有一种方法可以将其限制为仅在第一次点击时起作用，或者仅在每次 2 或 3 秒时注册一个点击事件？

Answer 1

既然你已经标记了你的问题 jQuery，我将用一个 jQuery 解决方案来回答。不要在元素中定义 onclick，而是创建元素，然后使用 .one() 绑定(bind)点击处理程序:

$('<selector for your link>').one('click', function () {
    addRow(this.data('id'));
});

.one 绑定(bind)一个只能触发一次的事件处理程序。