2

我正在编写一个专为平板电脑设计的应用程序，每次选择表中的一行时我都需要加载数据。选择一行后，我想将微调器放置在将加载新数据的 div 上。

这可能吗，还是我需要阻止整个页面或引入 BlockUI 之类的东西？

我正在使用 jQuery Mobile 1.2.0 Alpha。

谢谢！

4

3 回答 3

3

像这样 ？？？

演示

jQuery：

function loadData(id) {
    
    var btnID = id;
    $.ajax({
        
        url: "http://fiddle.jshell.net/akhurshid/g2tD5/show/",       
       
           beforeSend: function() {
            $('.loader').html('<img src="http://cdn.nirmaltv.com/images/generatorphp-thumb.gif" alt="Wait" />');
           },
              
           success: function(data) {           
               $('.loader').fadeTo('fast','0.0');
               $('#' + btnID).fadeTo('fast','0.0'); 
            
                var htmlData = $('.result').html(data).hide().css('opacity','0');
            
                $(htmlData).fadeTo('fast','1.0');                                 
           }
    });
}

HTML：

<div id="wrapper">
    <div class="loader"></div>
    <div class="result"></div>
    <button id="load-btn" onclick="loadData(this.id);">Load Data Here</button>
</div>

CSS：

#wrapper{
    width: 90%;
    margin: 20px auto;
    padding: 20px;
    overflow: hidden;
    border: 1px solid #777;
    background: #ccc;
}

.loader{
    width: 64px;
    height: 64px;
    top: 50%;
    left: 50%;
    position: absolute;
    z-index: 9999;
    display: block;
}
于 2012-09-05T11:59:45.030 回答
0 
$.mobile.loadingMessageTextVisible = true;

$.mobile.showPageLoadingMsg("b", "please wait...");
于 2012-12-24T12:31:14.870 回答
0

这行得通吗？

例子：

JS

// show the loader
$.mobile.showPageLoadingMsg();

// Move the loader left 30 pixels
$('div.ui-loader').attr('style','left:30px;'); ​

HTML

<div data-role="page" id="placeholder-page">
</div>
于 2012-09-08T00:50:16.520 回答