如何使内容脚本中的调整大小事件起作用

How to make resize event inside content script work?

本文关键字：调整 大小事 小事件 起作用 何使内 脚本      更新时间：2023-09-26

调整大小事件不适用于附加 SDK （1.8）
中的内容脚本此脚本：https://builder.addons.mozilla.org/package/142401/latest/

主.js： 

var Widget = require("widget").Widget;
var tabs = require('tabs');
var self = require('self');
var data = self.data;
var PageMod = require('page-mod').PageMod;
exports.main = function() {
    PageMod({
        include: [data.url("thepage.html")],
        contentScriptWhen: 'start',
        contentScriptFile: [data.url('thescript.js')],
        onAttach: function(worker) {
                console.log("attaching...")
        },
    });
    new Widget({
        id: "my-widget-1",
        label: "Widget",
        contentURL: "http://www.mozilla.org/favicon.ico",
        onClick: function(event) {
            tabs.open(data.url("thepage.html"));
        }
    });
};

剧本.js

console.log('started')
window.onresize = function(){console.log('resized!!!');}; //not working, never calls

如何在内容脚本中制作调整大小事件触发器？

通常不建议使用 window.onfoo 来附加事件侦听器。如果其他代码尝试以相同的方式附加事件侦听器（一个事件侦听器将获胜，而您不知道是哪一个），则可能会出现问题，如果您通过包装器而不是直接访问window，则它不起作用。因此，最好使用addEventListener方法：

window.addEventListener("resize", function() {
  console.log('resized!!!');
}, false);

在您的情况下，这实际上解决了问题 - 事件侦听器在调整窗口大小时触发。

相关文章：