jQuery 与 document.on 解除绑定？

Question

我的按钮触发了两次。其他 SO 帖子说要从文档中取消绑定单击功能。问题是 HTML 元素被动态附加到文档中，所以我需要调用：

$(document).on("click", "#id", function())

但是如何从 document.on 语句中“取消绑定”点击功能？

这是我的完整代码：

//Add Column
$(document).on("click", ".btn-add-tbl-col", addColumn); 

function addColumn() {

    console.log("addColumn fired!");  //Console shows this statement twice when I click the button once

    //Identify the table into cache
    var $tbl = $("#main-tbl-sch-tbl");

    //Count the number of records
    var rows = $tbl.find("tr.record").length;

    var columns = $tbl.find("th.tbl-column").length;
    columns++;

    var newCol = "<th class='tbl-column' data-id='0'>*Click*</th>";
    $(newCol).insertBefore($tbl.find("th.no-click-last"));

    $tbl.children("tbody.tbody-records").children("tr").each(function () {
            var $td = '<td class="record-cell" data-id="0" data-isstatic="1" data-col="' + columns + '" data-row="' + rows + '" data-colID="0" data-rowID="0" data-asid="0" data-deid="0" data-isnull="1" data-nameid="0" data-tbllookupid="0" data-collookupid="0" data-munterspn="0">*Click*</td>';
            $(this).append($td);
    });

    var newTableWidth = parseFloat((167 * columns) + 33 + 33);
    $tbl.css("width", newTableWidth.toString() + "px");
}

仅供参考：该类没有绑定其他点击功能

Answer 1

您可以使用绑定事件的相同方式取消绑定事件，但使用 off() 方法。

http://api.jquery.com/off/

因此，您需要的每个文档：

$(document).off('click', '#id').on("click", "#id", function())

在您需要的确切问题中：

$(document).off("click", ".btn-add-tbl-col").on("click", ".btn-add-tbl-col", addColumn);