在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准備就緒。