Question

我正在使用带有C＃和Telerik Ajax控件的ASP.NET 3.5开发Web应用程序。我的母版页中有一个iFrame。应用程序动态加载iFrame中的其他页面，iFrame高度在页面加载时动态调整。我在我的页面中使用RadScriptManager，RadAjaxPannel，RadAjaxLoadingPannel。问题是当ajax“回调”页面时，iFrame高度不会动态调整。

<%@ Page Language="C#" AutoEventWireup="true"  CodeBehind="MastetPage.master.cs" Inherits="MastetPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head" runat="server">
    <title></title>

   <script type="text/javascript" language="JavaScript">


       function setSize(elem) {
           var the_height;

           the_height = elem.contentWindow.document.body.scrollHeight;
           elem.height = the_height; // Its works fine in IE, Chrome, Safari but not work in FF and opera


       }



</script>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>

</head>
<body  id="Page_Master"  runat="server"  >

    <form id="formMasterPage" method="post" runat="server">

    <telerik:RadScriptManager ID="RadScriptManager1" runat="server"  AsyncPostBackTimeout="500">
    </telerik:RadScriptManager>

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" Height="100%" Width="100%"   >


    <div id="MainPage">

        <div class="Header">

        </div>

        <div id="ContentHolder">
            <div id="Content">
                <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                </asp:ContentPlaceHolder>

                <iframe id="IFrameMaster" name="IFrameMaster"  scrolling="auto" width="998px"  style=" min-height:500px;"  allowtransparency="true"   frameborder="0" runat="server" >
                </iframe> 



            </div>
        </div>
        <div id="Footer">

        </div>
    </div>
     </telerik:RadAjaxPanel>


    </form>

</body>
</html>

服务器端代码是：

// This code used in Page_Load Method and other methods depends on condition.
IFrameMaster.Attributes["src"] = "UIHome.aspx";
// This line used only Page_Load Method
IFrameMaster.Attributes.Add("onload", "javascript:setSize(this)");

这个问题的解决方案是什么？

由于 Md Nasir Uddin

Answer 1

编辑：更正后的示例

<html>
<head runat="server">
    <title></title>
    <script type="text/javascript" language="JavaScript">
        function setSize() {
            document.getElementById('<%= IFrameMaster.ClientID %>').height = document.body.scrollHeight - 30;
        }
    </script>
</head>
<body onload="setSize(); Sys.UI.DomEvent.addHandler(window, 'resize', setSize);">
    <form id="form1" runat="server">
    <asp:ScriptManager runat="server" />
    <iframe src="about:blank" runat="server" id="IFrameMaster"></iframe>
    </form>
</body>
</html>

只有两件事：

能够致电Sys.UI.DomEvent.addHandler（或$addHandler）您需要ScriptManager
-30是为了防止页面缩小时失败。玩你的边距并找到合适的值

Answer 2

使用ASP.NET AJAX，异步请求后不会调用文档的onload事件。而是使用ScriptManager的pageLoaded event和你应该执行iframe高度的js代码。

动态iFrame高度不适用于Ajax！

2 个答案: