Question

我正在尝试在下拉列表打开时向文档添加单击侦听器，这样当您单击文档中的任何其他位置时，它会关闭下拉列表并取消绑定单击侦听器。我正在使用https://stackoverflow.com/a/17342418

中的一些代码

我发现了一个问题。

结合：

$(document).bind('click', $scope.remindersDropdownHandler(event));

处理程序：

$scope.remindersDropdownHandler = function(event) {
        var element = $("#remindersDropdown");
        var isClickedElementChildOfPopup = element
            .find(event.target)
            .length > 0;

        var buttonElement = $("#remindersButton");
        var isbuttonElement = buttonElement
            .find(event.target)
            .length > 0;

        if (isClickedElementChildOfPopup || isbuttonElement) {
            return;
        }

        $scope.openReminders = false;
        // $(document).unbind('click', $scope.remindersDropdownHandler);
    }

处理程序本身工作正常，但它只执行一次！当您单击打开下拉列表的按钮并添加绑定时，会立即执行此操作。在那之后无论你在哪里点击它都不会再次激发听众。（相信我，我在过去一小时内使用console.log（）进行了大量调试。）

但是，如果不是引用处理程序的函数，而是像这样写：

$(document).bind('click', function() {
                var element = $("#remindersDropdown");
                var isClickedElementChildOfPopup = element
                    .find(event.target)
                    .length > 0;

                var buttonElement = $("#remindersButton");
                var isbuttonElement = buttonElement
                    .find(event.target)
                    .length > 0;

                if (isClickedElementChildOfPopup || isbuttonElement) {
                    return;
                }

                $scope.openReminders = false;
            });

这样可行，每次我点击文档上的某个位置时，它都会正确执行处理程序并关闭下拉列表。问题是因为我没有通过变量引用处理程序，我无法取消绑定它，因此处理程序是永久附加的。我需要能够取消绑定它，以便我的网站不会因文档上的点击侦听器而过载。

所以我的问题是：

1）当我引用$ scope.remindersDropdownHandler（）作为我的点击监听器的处理程序时，为什么它只会触发一次然后再不会？

2）如何修复我的代码，以便为click侦听器绑定相应的函数，然后在我选择时将其解除绑定？

注意：在示例代码中，我注释掉了// $（document）.unbind（'click'，$ scope.remindersDropdownHandler）;只是为了强调没有代码可以立即取消绑定我的点击监听器。

解决：Reddit上的用户指出从绑定中的指定处理程序中删除（事件）将允许它工作。 https://www.reddit.com/r/angularjs/comments/3fypck/help_issue_with_binding_and_unbinding_a_click/cttr0bw

即。转换

$(document).bind('click', $scope.remindersDropdownHandler(event));

到

$(document).bind('click', $scope.remindersDropdownHandler);

在Angular JS

0 个答案: