显示加载进度模式不会隐藏

时间:2019-09-24 15:39:36

标签: javascript jquery css asp.net vb.net

SQL选择执行完成后,我需要进度加载消息。我从互联网上获得了一个代码,但是加载完成后模态并没有隐藏。我需要这种概念。选择查询后,是否有任何代码可以帮助我制作进度加载消息。.我的问题是,当我在SQL中选择太多数据时,有一个急切的加载说明为什么我需要进度消息表明选择数据的过程正在执行/正在从数据库进行渲染。

这是我现在正在尝试从互联网获取的代码,但是有一个错误,加载完成后模态不会隐藏。

       <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;
}
</style>
<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();
    });

</script>

1 个答案:

答案 0 :(得分:0)

首先,live is deprecated使用'on'代替。

接下来,代码中发生的事情是,将模态附加到主体上,并在提交表单时用jquery的show 展示它。

您会注意到,没有任何代码可以删除/隐藏您的模态。您有很多选择可以做到这一点。删除或隐藏模态时,您将需要获取模态,或在ShowProgress函数内部将其保存在变量中

  • 从文档中删除模态。
  • 使用jquery的hide()隐藏模态。
  • 添加或删除CSS类或样式。

现在,可能正在发生第三个问题:您不知道何时完成表单提交。很好……除非您用其他代码更改了其他内容,否则永远不会。表单提交,默认情况下将向其目的地发出投递请求。因此,通常情况下,用户将被重定向,并且不再需要隐藏模式。

我认为在此处显示有关如何执行此操作的代码示例并不有价值,因为您似乎并没有试图理解从互联网获取的代码。我相信这个答案足以使您指向正确的Google搜索