Question

我在调整浏览器窗口大小时使用它来运行一些代码：$(window).resize(callback)

我还需要在手机和平板电脑中更改方向时运行此代码。以上火灾会对此事件有所影响吗？

Answer 1

有些设备/浏览器有，有些没有。您需要确定支持的浏览器和设备。

如果你想要在安全的一面，你应该使用resize事件并获取/检查其中的尺寸;如果你知道你想要的设备改变了方向：

简易解决方案：

// Listen for orientation changes      
window.addEventListener("orientationchange", function() {
    // Announce the new orientation number
    alert(window.orientation);
}, false);

更安全/支持

// Listen for resize changes
window.addEventListener("resize", function() {
    // Get screen size (inner/outerWidth, inner/outerHeight)

}, false);

David Walsh写了一篇关于调整大小和方向改变事件的好文章。更多关于方向变化和尺寸的信息： http://davidwalsh.name/orientation-change

Answer 2

答案是恕我直言：否

但是：

$(window).on('resize orientationchange', function(){
//do stuff
});

你应该覆盖

小心，这可能会触发两次，具体取决于浏览器

Answer 3

一个简单的解决方案是根据事件类型传递一个值。

window.addEventListener('resize', function () {
    myFunction('resize');
});

window.addEventListener("orientationchange", function() {
    myFunction('orientation');
});

function myFunction(value) {
    if (value == 'resize') {
       // do something
    } else if (value == 'orientation') {
       // do something else
    }
}

Answer 4

我的解决方案：

在方向更改未执行时生成事件
使用油门防止调整大小的更新（例如lodash库）

window.addEventListener("resize", throttle(function() {
    //to do when resize
}, 50), false);

window.addEventListener("orientationchange", function() {
    // Generate a resize event if the device doesn't do it
    window.dispatchEvent(new Event("resize"));
}, false);

$（window）.resize（）会触发方向更改吗？

4 个答案: