Question

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

content.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 highlightProcess = (event) => {...}

Answer 2

已解决

已更改

$(this).unbind("click");

到

$(document).unbind("click");

如何在绑定事件中取消绑定

2 个答案: