防止在页面刷新时显示模型窗口答案

【问题标题】：Preventing model window displaying on page refresh防止在页面刷新时显示模型窗口
【发布时间】：2016-07-21 12:51:44
【问题描述】：

我正在使用 Bootstrap 模式来显示按钮单击窗口的详细信息。现在每当页面加载或刷新模型时也出现问题。我怎样才能防止这种情况发生？

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

平均售价

<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>

【问题讨论】：

您能否提供更多信息，一些代码，一个JSfiddle，一个链接，以便任何人都可以帮助您。

标签： javascript c# asp.net twitter-bootstrap

【解决方案1】：

不知道在哪里打电话给.showPopup()。这个细节很重要。但是，如果它以任何形式的 page_load 或从 page_load 调用的任何形式调用，那么就会导致该问题。

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

【讨论】：

【解决方案2】：

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

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

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

【讨论】：