【发布时间】:2017-11-27 11:42:00
【问题描述】:
我正在尝试在我的服务器上加载我的数据表时显示加载 gif。 我从here 找到了一些代码,但是当我尝试实现它时,我得到运行时错误“显示”未定义。下面是我正在使用的 javascript/jquery 代码
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
function ShowProgress() {
setTimeout(function () {
var modal = $('<div />');
modal.addClass("modal");
$('body').append(modal);
var loading = $(".loading");
loading.show();
var top = Math.max($(window).height() / 2 - loading[0].offsetHeight / 2, 0);
var left = Math.max($(window).width() / 2 - loading[0].offsetWidth / 2, 0);
loading.css({ top: top, left: left });
}, 200);
}
$('form').live("submit", function () {
ShowProgress();
});
我的 div id 正在加载,所以当它在 javascript 中遇到 loading.show() 时,它会出错。
<div class="loading" align="center">
Loading. Please wait.<br />
<br />
<img src="gears.gif" alt="" />
</div>
我正在页面加载事件中注册我的脚本,例如:
If IsPostBack = False Then
Dim script As String = "$(document).ready(function () { $('[id*=Button2]').click(); });"
ClientScript.RegisterStartupScript(Me.GetType, "load", script, True)
End If
编辑: 我正在编辑它以添加 Css 标记。
<style type="text/css">
.modal
{
position: fixed;
top: 0;
left: 0;
background-color: black;
z-index: 99;
opacity: 0.8;
filter: alpha(opacity=80);
-moz-opacity: 0.8;
min-height: 100%;
width: 100%;
}
.loading
{
font-family: Arial;
font-size: 10pt;
border: 5px solid #67CFF5;
width: 200px;
height: 100px;
display: none;
position: fixed;
background-color: White;
z-index: 999;
}
任何帮助将不胜感激。
【问题讨论】:
-
你好,div.loading 是什么时候渲染的?我猜你在提交按钮之后将它添加到 DOM 中。您是否将其样式隐藏起来,并将其显示()给用户,或者您动态创建它,如果这样使其隐藏。希望对你有帮助
-
Krum,我编辑了我的帖子,显示了我的 Css 标记。加载 div 位于网格之后,一旦构建,我将使用我的数据表进行更新。该按钮位于页面顶部。
-
试试这个 loading.css( "display", "block" ) 如果它已经被隐藏了。同时发布您看到的控制台错误。
-
praveen,我试过你的建议,它似乎有效。请注意,我还在服务器端更改了一些代码,现在一切似乎都正确显示了!感谢所有的帮助!
标签: javascript jquery asp.net vb.net