如何在绑定事件中解除绑定

Question

我正在 chrome 扩展中开发一项功能，允许用户将鼠标悬停在页面上并检测任何元素。页面右上角的选择按钮可激活该功能。每当点击一个元素时，按钮附近的输入框就会填充该元素的innerHTML。单击后，选择应停止，并且该功能将不再识别单击。一切正常，但我无法解除点击事件的绑定。我的代码有什么问题吗？请告诉我

内容.js

window.onload = () => {

    var highlight = function (event){

        if(!$(event.target).is("#home_container *")){

            event.target.style.backgroundColor = "rgba(121, 204, 255, 0.4)";

        }

    }

    var remove = function (event){

        if(!$(event.target).is("#home_container *")){

            event.target.style.backgroundColor = "";

        }

    }

    var disableLinks = function (event){

        event.preventDefault();

    }

    var highlightProcess = function(event) {

        $('a').bind("click", disableLinks);

        $(document).bind("mouseover", highlight);

        $(document).bind("mouseout", remove);

        $(document).bind("click", (elem) => {

            if(!$(elem.target).is("#home_container *")){

                $("#input_box").val(elem.target.innerHTML);

                remove(elem);

                $(document).unbind("mouseover", highlight); //<-- works

                $(document).unbind("mouseout", remove); //<-- works

                $('a').unbind("click", disableLinks); //<-- works

                $(this).unbind("click"); //<-- this does not work

            }

        });

    }

    document.getElementById('st_select_element_button').addEventListener("click", highlightProcess);

}

Answer 1

您可以将 highlightProcess 更改为箭头功能，然后“this”将引用文档：var&nbsp;highlightProcess&nbsp;=&nbsp;(event)&nbsp;=>&nbsp;{...}

Answer 2

解决了改变了$(this).unbind("click");至$(document).unbind("click");