jQuery $（document）.off（）在Chrome扩展程序中不起作用

Question

我已经基于https://thoughtbot.com/blog/how-to-make-a-chrome-extension创建了一个Chrome扩展程序（完整文件请看末尾）

我进行了两项更改：我使用最小化的jQuery 3.1.1代替了上一页中给出的旧版本，并且更改了content.js：

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {
        if( request.message === "clicked_browser_action" ) {
            $(document).off("touchmove mousewheel mousemove scroll");
        }
    }
);

当我单击扩展的按钮并打开相应的测试页时，[$(document).off()命令不起作用。它不会给出错误，只是什么都不做。

我已经检查过了。如果我在要影响的页面上的控制台中输入$(document).off("touchmove mousewheel mousemove scroll");，则可以正常工作。如果在扩展程序中运行，则不是。

[我尝试检查扩展名中的document是否正确，并且在扩展名中（和页面上的控制台中）的断点中检查时，document.domain给出正确的结果。

我尝试检查jQuery._data( jQuery(document)[0]).events["touchmove"]（和“ mousewheel”，“ mousemove”，“ scroll”），并且可以在控制台中使用，但是如果我对扩展名进行断点，则会收到错误（Cannot read property 'touchmove' of undefined）。当我进一步检查时，jQuery._data( jQuery(document)[0])提供以下内容：

在控制台中：

Object
    events: Object
    handle: function (e)
    __proto__: Object

在断点：

Object
    __proto__: Object

我已经尝试了其他一些东西（例如，jQuery可以访问并且可以使用，等等）。

Answer 1

您正在尝试执行$(document).off()，以删除页面脚本（网页中已经存在的脚本；即不是您的内容脚本）添加的jQuery事件处理程序。 jQuery存储哪些事件处理程序已添加到正在使用的jQuery实例内部的数据结构中。您的内容脚本与页面脚本的上下文/范围不同。因此，当您在内容脚本的上下文中执行$(document).off()时，该jQuery实例不知道页面脚本添加的所有偶数处理程序，并且无法删除它们。

为了使$(document).off()生效，它必须在页面脚本上下文中运行。在页面脚本上下文中执行代码的最常见方法是创建<script>元素并将其插入到页面的DOM中。

您可以将代码更改为：

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {
        if( request.message === "clicked_browser_action" ) {
            let newScript = document.createElement('script');
            newScript.innerHTML='$(document).off("touchmove mousewheel mousemove scroll");';
            document.head.appendChild(newScript);
        }
    }
);

添加的脚本在页面上下文中运行，因为它现在是DOM中的<script>元素。浏览器识别出已添加<script>元素，并在对其进行处理后立即对其进行评估（执行所包含的代码）。对于添加到DOM中的任何其他元素，它的作用基本上相同。因为它是页面的一部分，所以<script>内部的代码将在页面脚本上下文/范围内运行。

虽然上述工作，特别是对于这样的短代码，但我创建<script>元素以在页面上下文中执行代码的首选方法是使用我编写的名为executeInPage()的函数。您可以在my answer to "Calling webpage JavaScript methods from browser extension"中找到该功能。