在jQuery文档准备好之前加载Modernizr

Question

我是第一次使用modernizr，遇到了一些问题。

这是我已完成的步骤：

在html标头处加载了Modernizr在html页脚处加载了JQuery

在准备好的Jquery文档中，我使用Modernizr检查了几个浏览器功能。 如果该检查失败，它将重定向到另一个页面。

在大多数情况下，使用在准备好文档中的Modernizr进行检查的工作正常，但有时会失败，甚至从同一浏览器重定向到另一个页面。

我猜这是因为文档准备就绪在Modernizr之前加载，因此Modernizr无法正常工作。 有什么可以帮助我的吗？

$(function() { 
    //if browser can't provide certain features, it will redirect the browser to dumb phone page

    if(satisfiedWithBrowser()){
        // do other stuff
    }else
        window.location = 'redirect/';
});

function satisfiedWithBrowser(){    
    //console.log(Modernizr);

    if(!Modernizr.csstransforms || !Modernizr.backgroundsize || !Modernizr.cssanimations || !Modernizr.hashchange) // || !Modernizr.touch)
        return false;
    else
        return true;
}

谢谢

Answer 1

是的，听起来像您有比赛条件，我想尝试一下两种方法：

• 将modernizer移到页脚的jQuery旁边，以便在之前请求它。
• 而不是等待$(document).ready()使用$(window).load() 。

第一种选择应该对您的问题进行排序。 原因-至少就我一直以来了解的脚本标记的放置-原因是，当脚本标记在正文中时，它会在被查找/解析时被请求，而头部的脚本标记将在不同时间触发取决于浏览器（和缓存状态） 。 基本上，您需要使用相同的方法（同时在页脚或在头部）加载两个脚本标签。

第二个选项应该作为后备，因为您将等待直到window.load，其中应包括等待所有资源，而不是等待DOM准备就绪。