阻止模型窗口在页面刷新时显示

本文关键字：刷新 显示 模型 窗口 | 更新日期: 2023-09-27 17:58:07

我使用Bootstrap模式在按钮点击窗口上显示详细信息。现在，每当页面加载或刷新模型时也会出现问题。我该如何防止这种情况发生。？

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

ASP

<section class="content">
    <div class="row">
        <div class="col-lg-12" style="margin: 20px 0 20px;">
            <div class="box">
                <div class="box-header">
                    <h3 class="box-title">Orders</h3>
                </div>
                <!-- /.box-header -->
                <div class="box-body table-responsive ">
                    <asp:ListView ID="lvCustomers" runat="server" >
        <LayoutTemplate>
            <table id="product-master" class="table table-bordered table-striped">
                <tr>
                    <th>Order #</th>
                    <th></th>
                </tr>
                <asp:PlaceHolder runat="server" ID="groupPlaceHolder1"></asp:PlaceHolder>
            </table>
        </LayoutTemplate>
        <GroupTemplate>
            <tr>
                <asp:PlaceHolder runat="server" ID="itemPlaceHolder1"></asp:PlaceHolder>
            </tr>
        </GroupTemplate>
       <ItemTemplate>
            <td><%# Eval("OrderNo") %></td>
            <td>
                <asp:Button ID="btnDetails" runat="server" Text="Products" class="btn btn-primary btn-flat" CommandName="ViewDetails" CommandArgument='<%# Eval("OrderNo")  %>' OnCommand="btnDetails_Command" />
        </ItemTemplate>
    </asp:ListView>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade modal-primary" id="myModal" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">Products List</h4>
            </div>
            <div class="modal-body">
                <div class="box-body table-responsive no-padding">
                    <%# Eval("OrderNo") %>
                     <asp:ListView ID="LvDetails" runat="server" GroupPlaceholderID="groupPlaceHolder1" ItemPlaceholderID="itemPlaceHolder1">
        <LayoutTemplate>
            <table id="products" class="table">
                <tr>
                    <th>Order #</th>
                </tr>
                <asp:PlaceHolder runat="server" ID="groupPlaceHolder1"></asp:PlaceHolder>
            </table>
        </LayoutTemplate>
        <GroupTemplate>
            <tr>
                <asp:PlaceHolder runat="server" ID="itemPlaceHolder1"></asp:PlaceHolder>
            </tr>
        </GroupTemplate>
        <ItemTemplate>
            <td><%# Eval("OrderNo") %></td>
            </ItemTemplate>
    </asp:ListView>
                </div>
                <!-- /.box-body -->
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Done</button>
            </div>
        </div>
    </div>
</div>
</section>

阻止模型窗口在页面刷新时显示

不确定在哪里调用.showPopup()。这个细节很重要。但是，如果它在任何类型的page_load或从page_load调用的任何东西中被调用，那么这将导致该问题。

此外，如果您从某些javascript代码调用.showPopup()，那么在加载/重新加载页面时，所有javascript代码都会运行。您希望包含某种条件，使其仅在需要时调用.showPopup()。

您的项目中有这样的东西吗？

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

如果是这样的话，这可能是问题的根源，因为这个js函数会将模态设置为在页面加载时显示。你也可以通过谷歌搜索这个问题来找到很多。

相关文章：