0

我的代码中有以下函数，我想在设备窗口/视口宽度小于 768px 时触发一个函数。此函数在页面加载时触发（因此在侦听器之外进行查询），在 Chrome 中进行测试期间，我发现侦听器在调整大小时触发两次，首先返回 false，然后返回 true。尽管窗口/视口的宽度永远不会低于 768px。在 Firefox 中进行相同的测试时，它似乎表现正确。

有没有其他人经历过这种情况，如果有，你的解决方案是什么？

var mql = window.matchMedia("(min-width: 768px)");

if (!mql.matches) {
    myFunction();
};

mql.addListener(function(device) {
    if(!device.matches) {
        myFunction();
    }
});

注意在 Chrome 中，我在“设备模式”中选择“Apple iPad 3/4”进行测试，在 Firefox 中，我使用的是 768x1024 运行的“响应式设计视图”

4

0 回答 0