Question

我试图通过点击按钮使用fancybox Iframe来加载网站，这是第一次运行得非常好，并且第二次尝试加载它时起作用。

如果我尝试从内容模板中移除按钮以及ahref并将其放在外面，那么Iit会向我显示一个空白的iframe，其余代码正常工作。这是我的代码：

   <script type="text/javascript">
    $(document).ready(function () {

        $("#various3").fancybox({
            'width': '75%',
            'height': '75%',
            'autoScale': false,
            'transitionIn': 'none',
            'transitionOut': 'none',
            'type': 'iframe'
        });

        $('#<%=txtWebsiteAddress.ClientID%>').change(function () {
            $('#various3').attr('href', $(this).val());
        });


        $("#<%=btnShowThumbnailImage.ClientID %>").click(function () {

            $("#various3").trigger('click');

        });
    });
</script>

这是我的标记：

    Width:<asp:TextBox ID="txtWidth" runat="server">320</asp:TextBox>
    Height:<asp:TextBox ID="txtHeight" runat="server">240</asp:TextBox>


    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
    <li><a id="various3" href=""></a></li>
    <asp:Button ID="btnShowThumbnailImage" runat="server" Text="Button" OnClick="btnShowThumbnailImage_Click" />
    <asp:Image ID="imgWebsiteThumbnailImage" runat="server" Visible="false" />
    <asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="0">
    <ProgressTemplate>
    <img src="images/Loader.gif" alt="loading" />
    </ProgressTemplate>
    </asp:UpdateProgress>
    </ContentTemplate>
    </asp:UpdatePanel>

Answer 1

更新UpdatePanel后，需要重新初始化javascript，因为在UpdatePanel运行后，Dom会更改。这可以通过UpdatePanel中包含的两个函数来完成。使用这两个调用，您可以在页面加载时重新初始化您的FuncyBox，然后再在每个UpdatePanel上重新初始化。

<script type="text/javascript">

    var prm = Sys.WebForms.PageRequestManager.getInstance();    
    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);

    function InitializeRequest(sender, args) {      
    }

    function EndRequest(sender, args) {
        InitMyFancyBox();
    }

    $(document).ready(function () {
        InitMyFancyBox();
    });


    function InitMyFancyBox()
    {
        $("#various3").fancybox({
            'width': '75%',
            'height': '75%',
            'autoScale': false,
            'transitionIn': 'none',
            'transitionOut': 'none',
            'type': 'iframe'
        });

        $('#<%=txtWebsiteAddress.ClientID%>').change(function () {
            $('#various3').attr('href', $(this).val());
        });


        $("#<%=btnShowThumbnailImage.ClientID %>").click(function () {
            $("#various3").trigger('click');
        });
    }    
</script>

为什么Iframe第二次没有加载？

1 个答案: