Question

我正在为youtube测试Chrome扩展程序，但我遇到了一个问题，即mouseenter多次启动。

这就是我在缩略图上输入简单鼠标的方法：

$( "body" ).on('mouseenter', '#thumbnail', function() {
    console.log('click');
});

现在一旦页面加载并且我将鼠标悬停在任何缩略图上，它将只触发一次，并且每次操作都会在控制台内显示点击文本。

当我浏览到不同的youtube部分时，问题就开始了，让我们说 - 趋势。现在，如果我在趋势页面中再次悬停在缩略图上，则每个操作的控制台中的点击文本将显示3次。如果我再次浏览主页面，它会使悬停动作的每个输出翻倍或者有时会增加。

我尝试过.off方法，但没有区别。哪里可能是问题？

这是我的js将jquery和函数js加载到网站：

chrome.tabs.onUpdated.addListener(function (tabId , info) {
  if (info.status === 'complete') {
    chrome.tabs.executeScript({
        file: 'jquery-3.2.1.min.js'
    });
    chrome.tabs.executeScript({
        file: 'payload.js'
    });
  }
});

每次youtube网站加载不同的页面时，是否会加载executeScript？

Answer 1

例如，当您的页面内容动态更改时，您只需要.off。如果更改的内容具有相同的元素（例如，相同的id），则您有限 - 取决于您的onContentChange事件 - 该内容上的两个不同的.on事件。因此，当您动态更改内容时，必须在更改内容之前运行.off。否则你会遇到问题。一个典型的问题是当您使用ajax加载内容并分配一些.on事件但从未运行.off时。

对于您的问题，您是否尝试过addListener中的简单console.log来检查您是否多次执行脚本？

Answer 2

好吧，问题似乎是我的清单......我多次更改了我的清单，但这次出于某种原因工作了。

我从清单中删除了payload.js和加载内容脚本的两个executeScript函数：

 "content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "js": ["jquery-3.2.1.min.js","payload.js"]
    }
  ],

现在它就像一个魅力......

jQuery mouseenter多次启动？

2 个答案: