如何使用jQueryMobile中的pageLoading阻止UI

Question

使用$.mobile.pageLoading(false)時可以阻止UI嗎？

Answer 1

此功能沒有在jQueryMobile Alpha 1.0a4.1中實現。

我解決了這個問題，添加一個具有足夠高的Z指數的覆蓋div。

JS：

$(document).ready(function() {   
    $('body').append('<div id="block-ui"></div>');  

    $('#ajax_request').click(function(){   
     $('#block-ui').show(); 
     $.mobile.pageLoading(false); 
    }); 
}); 

CSS：

#block-ui { 
    display: none; 
    cursor: wait; 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    width: 100%; 
    height: 100%; 
    z-index: 9; 
    background-color: #CCCCCC; 
    opacity: 0.5; 
} 

如果你使用，你需要重寫的z-index值的固定杆使用：

.ui-header-fixed, .ui-footer-fixed { 
    z-index: 8 !important; 
}