jQuery .ready/resize 在 iPad 上不起作用答案

【问题标题】：jQuery .ready/resize does not work on iPadjQuery .ready/resize 在 iPad 上不起作用
【发布时间】：2014-11-14 06:05:23
【问题描述】：

为什么就绪/调整大小事件在 iPad 上不起作用？他们在电脑上工作，但不在 iPad 上。有人知道我做错了什么吗？

jQuery(document).on('ready', function() {
    jQuery(window).on('resize', function() {
        /* Tablet Portrait size to standard 960 (devices and browsers) */
        if (jQuery(window).width() < 960 && jQuery(window).width() > 768) {
           //change the attributes from the div #home_content (first parameter: the attribute, what it needs to be)
           jQuery('#home_content').attr('class','sixteen columns');
           jQuery('#slider').attr('class','sixteen columns');
        }
        else{
            jQuery('#home_content').attr('class','nine columns');
            jQuery('#slider').attr('class','nine columns');
        }

        /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
        if(jQuery(window).width() < 767 && jQuery(window).width() > 480) {
            //code
        }
        else{

        }

        /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
        if(jQuery(window).width() < 479) {
            //code
        }   
        else{

        }
    }).trigger('resize'); // Trigger resize handlers.       
});//ready

【问题讨论】：

你的意思是他们没有工作，还是没有解雇？如果您在其中输入alert('foo')，它会弹出吗？
在电脑上会弹出，但在 iPad 上不会弹出
您是在文档中准备好警报还是调整大小？他们两个都没有开火还是只有一个？
你也可以使用 window.addEventListener('orientationchange', function () { // 你的代码在这里 };
@brso05，您的编辑将“不”与“事件”匹配（“为什么就绪/调整大小事件不起作用”），这是不正确的。我的编辑是有效的。

标签： jquery ipad

【解决方案1】：

试试这个：

// Checks to see if the platform is strictly equal to iPad:
if (navigator.platform === 'iPad') {
    window.onorientationchange = function() {

        var orientation = window.orientation;

        // Look at the value of window.orientation:
        if (orientation === 0) {
            // iPad is in Portrait mode.

        } else if (orientation === 90) {
            // iPad is in Landscape mode. The screen is turned to the left.

        } else if (orientation === -90) {
            // iPad is in Landscape mode. The screen is turned to the right.

        } else if (orientation === 180) {
            // Upside down portrait.

        }
    }
}

希望这会有所帮助！

【讨论】：

【解决方案2】：

如果你想捕捉 iPad 的方向，你应该使用：

window.onorientationchange = function(e) { /* your code */ };

而不是窗口调整大小事件。

【讨论】：

我应该如何将它包含在我的代码中？像这样？：jQuery(window).onorientationchange()

【解决方案3】：

请关注关注

$(window).resize(function() {

alert("Window size changed");

});

要访问高度和宽度，您可以使用

$(window).width();

$(window).height();

【讨论】：

【解决方案4】：

试试jQuery(document).ready(function(){ alert('booya!') })；

如果您收到警报，请将您的代码放入该函数中。还可以访问 Chrome 中的页面并通过在开发者工具中调出内置控制台来检查 Javascript 错误。

【讨论】：

【解决方案5】：

我找到了解决方案：我使用了 jQuery(document).width() 而不是 jQuery(window).width()，现在我的脚本有望在每个设备上运行 :)
感谢您的回答！

【讨论】：

【解决方案6】：

现在可以了，

我的代码不起作用，因为我使用了在 iPad 上不起作用的 window.width()，我将其更改为 document.width，现在它可以工作了。 :)

【讨论】：