2013-09-26 59 views
0

使用媒體查詢我創建了一個崩潰的導航欄,而我的標誌位於底部。用enquire.js我預設了最後一個li。我怎樣才能執行prepend只在第一場比賽,以防止切換一個鋰,每場比賽的權利?如何只在第一次匹配時加上選擇器?

prependLogo : function() { 

     query = "screen and (max-width: 979px)"; 
      handler = { 
       match: function() { 
        $(.nav-collapse .nav).prepend($("li:last")); 
       }, 

       unmatch : function() { 

       }, 
      }; 

      enquire.register(query, handler); 
    }, 

回答

0

有兩種方法可以解決這個問題。一種是利用查詢的unregister方法。另一種是利用setup回調和deferSetup標誌。

setup回調只會被調用一次。通常在註冊查詢時立即調用它,但是與deferSetup標誌結合使用時,將會延遲setup,直到查詢第一次匹配(不幸的是,查詢期望總會有一個match回調,因此我們將只提供一個空函數) :

enquire.register("screen and (max-width: 979px)", { 
    setup : function() { 
    $(.nav-collapse .nav).prepend($("li:last")); 
    }, 
    deferSetup : true, 

    match : function() {} 
}); 

unregister方法確實如你所料,註銷查詢。如果我們調用unregister從我們的匹配回調中我們也可以達到同樣的效果:

enquire.register("screen and (max-width: 979px)", { 
    match : function() { 
    $(.nav-collapse .nav).prepend($("li:last")); 
    //note this unregisters *all* handlers for this mq (if you have more than one) 
    enquire.unregister("screen and (max-width: 979px)"); 
    } 
}); 

這裏展示的兩種辦法的工作示例:http://codepen.io/WickyNilliams/pen/vFLEH

此外,請注意在上面的代碼中,你不使用var關鍵字初始化您的變量。這在JS中是不好的做法,因爲任何聲明沒有var的變量都附加到全局範圍,這可能不是你想要的:)

相關問題