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 datasrc中执行此操作：

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绑定点击处理程序：

__contains__()

in绑定一个只能被触发一次的事件处理程序。

Answer 2

对于那些不使用该库的人而言，不使用jQuery的替代方法是创建一个只能被触发一次的函数。您可以使用变量来跟踪它，但我最喜欢的方法是在函数本身上定义一个属性：

var addRow = function () {
    if (!addRow.hasRun) {
        // Do whatever addRow() usually does

        addRow.hasRun = true;
    }
};

限制点击数据表元素

2 个答案: