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

时间:2012-09-11 11:39:57

标签: javascript jquery html modernizr

我第一次使用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;
}

由于

1 个答案:

答案 0 :(得分:0)

是的,听起来你有竞争条件,我想说有两种选择:

  • 将现代化程序移动到页脚中的jQuery旁边,以便之前请求它。
  • 而不是等待$(document).ready()使用$(window).load()

第一个选项应该排序您的问题。原因 - 至少就我一直都理解脚本标签的位置而言 - 当脚本标签位于正文中时,它会在找到/解析时被请求,而头部中的脚本标签将在不同时间被触发取决于浏览器(以及缓存状态)。你基本上需要使用相同的方法加载你的脚本标签(在页脚或两者都在头部)

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