javascript - 单击功能有时会触发两次，三次等等

我已经使用此click函数来调用某些事件，但是当我单击该类时，有时会触发两次，三次甚至更多次。

请给我有关此代码以及如何更正它的正确建议。

 $(".PositiveReaction").unbind("click").click(function () {
        var itemGraphId = this.id;
        itemGraphId = itemGraphId.replace("Like", "");
        $.ajax({
            type: "Post",
            url: "/React/AddReact",
            dataType: "JSON",
            data: { "itemGraphId": itemGraphId, "reactionTypeEnum": "POSITIVE" },
            success: function (data) {
                $.each(data, function (i, item) {
                    $("#CountLike" + item.GraphID).html(item.CountPositiveReactions);
                    $("#CountDisLike" + item.GraphID).html(item.CountNegativeReactions);
                });
            },
            error: function (req, status, error) {}
        });
  });

最佳答案

使用附加到不变祖先的委托事件。然后，您无需打开和关闭它（当然取决于您的应用程序逻辑）：

 $(document).on("click", ".PositiveReaction", function () {

它将适用于当前和将来的匹配元素。

委托事件通过侦听冒泡至不变的祖先的事件来工作。如果没有方便/更简单的选项，则默认为document。然后，它将jQuery选择器应用于气泡链中的元素。然后，它为导致事件的任何匹配元素调用函数。这意味着直到事件时间才需要匹配元素，而不是在事件处理程序创建时才匹配。

注意：请勿将'body'用于委托事件，因为样式可能导致主体的高度为0，并且可能不会发生事件！始终使用document作为后备。

如果您实际上需要关闭委托处理程序，请在事件名称上使用名称空间：

开启：

 $(document).on("click.myapp", ".PositiveReaction", function () {

关闭：

 $(document).off("click.myapp");