1

每当页面加载时，我的母版页上都有以下模式作为带有旋转 gif 的加载消息。

<div id="divModal" class="modal fade" role="dialog">
        <div id="divModalDialog" class="modal-dialog">
            <div id="divModalContent" class="modal-content" style="text-align: center;">
                <div id="divModalBody" class="modal-body">
                    <img src="/Images/Loading.gif" width="200" alt="Loading..." />
                    <div id="divMessage" style="margin-top: 10px">
                        <b>Please Wait...</b>
                    </div>
                </div>
            </div>
        </div>
    </div>

我正在使用以下脚本来尝试显示和隐藏模式。

<script type="text/javascript">
        function showModal() {
            $('#divModal').modal('show');
        }

        function hideModal() {
            $('#divModal').modal('hide');
        }

        $(document).ready(showModal());
        window.onload = hideModal();
    </script>

在 document.ready 中显示模态效果很好。但是当页面上的所有内容加载完成时，通常大约 5 秒，我希望模态消失。根据我的阅读，将隐藏模式函数放在 window.onload 中应该可以工作，但事实并非如此。一旦页面开始加载，我的模式就会弹出，但只是无限期地旋转。

我在正文结束之前拥有这两个功能，因为它似乎是显示模态功能唯一可以工作的地方。我什至在每个函数中都放置了警报和控制台日志，以确保它们以正确的顺序触发，而且它们确实如此。他们开火时我也没有收到任何错误。但是隐藏并没有隐藏模态。有谁知道为什么会这样？

编辑：我已经让 hideModel() 通过将模型包装在 setTimeout() 中来实际隐藏模型。

window.onload = setTimeout("hideModal()", 1000);

但是，无论页面是否完成加载，无论第二个参数有多长，它都会立即隐藏模式。

4

2 回答 2

0

我终于想出了一个解决方案，所以希望如果有人遇到这篇文章，它会帮助他们。这是之前在另一个页面上实现的东西，但我不得不稍微调整一下才能让它正常工作。

在文档准备功能中，我将其用于 ID 为 btnEditAddress 的模态框上的确认按钮：

$('#' + '<%=btnEditAddress.ClientID%>').attr('onclick',
"$('.modal').modal('hide');setTimeout(function(){" + $(this).prop('href') + "}, 50);");

我仍然不确定为什么我尝试过的其他方法都不起作用。

于 2018-07-26T15:48:29.837 回答
0

要隐藏引导模式，请使用$('#divModal').modal('toggle');

于 2018-06-20T20:41:24.930 回答