0

当我单击表格的任何单元格时，我在对话框的表格中显示一些动态数据，它在另一个弹出窗口（对话框）的新表格中显示另一个动态数据。单击第一个表的单元格后，第二个弹出表需要一些时间才能出现。我想显示一个加载器图像，直到我的第二个表（对话框）出现......我在网上搜索了很多，但没有遇到我的情况......

当我单击第一个表的单元格时，会调用此函数...

// CODE SNIPPET
function access(test1,facilityName,status)
{
    var divString="<table>"+"<tr>"+"<td><table><div id='rfidMove'></div></table></td>"+"</tr></table>";

    //sending some parameters on a jsp page and based on these params getting content of   that jsp here

    $.post("RfidInventory.jsp?","container="+test1+"facilityName="+facilityName+"&                                                                                                                   status="+status, function(data){

    // showing another jsp page data here to make table in this dialog       
         $("#rfi").dialog("destroy");
         $("#rfi").html(divString);
         $("#rfi").dialog({  
         width: '650',
         height: '300',
             zIndex : '3000',
             modal:true, 
         title: "RFID INVENTORY DETAIL",
             overlay: { opacity: 0.1, background: 'black'} 
       });
   $("#rfidMove").html(data);  
});

请帮助我，我已经在这方面花了很多时间，但仍在寻找解决方案......

4

2 回答 2

1

使用动画 GIF 在 DOM 中的某处添加loader标记，然后将其隐藏：

<div id="#loader" style="display: none;"><img src='loader.gif' alt='loading' /></div>

然后在 AJAX 调用之前显示它：

$("#loader").css("display", "");
$.post(url, function(data) {
    $("#loader").css("display", "none");
});

这是正常的做法。您可以在此站点下载漂亮的自定义动画 GIF：http: //ajaxload.info/

编辑在 Firebug 中尝试这些东西。

添加加载器

$("body").append("<img id='myloader' src='http://www.ajaxprojects.com/db/img16.gif' />");

把它藏起来

$("#myloader").css('display', 'none');
于 2012-06-26T05:58:20.510 回答
1 
var val = 10;
$( "#progressbar" ).progressbar({
    value: val
});

<div id="progressbar"></div>

请参阅此链接：-

http://jqueryui.com/demos/progressbar/

http://docs.jquery.com/UI/Progressbar

http://www.codeproject.com/Articles/66049/Showing-Progress-Bar-Using-jQuery

于 2012-06-26T05:58:37.250 回答