在不刷新父页面的情况下更改 iframe src

Posted 2023-05-09

【中文标题】在不刷新父页面的情况下更改 iframe src

【英文标题】：Change iframe src without refreshing parent page

【发布时间】：2018-02-23 13:47:45

【问题描述】：

我在 ASP.NET 站点中有一个页面。 iframe 位于 Ajax 更新面板中。

我需要从 javascript 更改 iframe 的 src 属性，我可以这样做。问题是当src属性改变时，父页面刷新。

我只需要框架导航，而不需要父页面。

html：

        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <iframe id="previewIframe" runat="server" Width="800px"></iframe> 
            </ContentTemplate>               
        </asp:UpdatePanel>  

javascript：

var frame = $("#previewIframe");
frame.setAttribute('src', "http://www.google.com");

【问题讨论】：

框架在实际生成时是否真正称为 previewIframe？还是 ASP.NET 正在为其添加控件名称？

同样在 jQuery 中它应该是：$("#previewIframe").attr('src', "google.com"), setAttribute 用于 javascript DOM。

我为 iframe 设置了 ClientIDMode="Static" 并刷新了

啊，做到了。结合静态 ID 和更新 jquery 现在可以工作了。标记： javascript: $("#previewIframe").attr('src', "google.com");

很高兴听到它有帮助！

【参考方案1】：

html:

        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <iframe ClientIDMode="Static" id="previewIframe" src="" runat="server"></iframe> 
            </ContentTemplate>               
        </asp:UpdatePanel>  

javascript：

$("#previewIframe").attr('src', "http://www.google.com");

忘记了在 ASP 中元素 ID 不是神圣的，它们是预先添加的，例如。 "MainContent_previewIframe"

一旦我添加了 ClientIDMode="Static" 属性 jquery 就可以正确引用该元素。

还将 jquery 方法更新为 $("#previewIframe").attr('src','google.com'); - 我正在混合直接的javascript和jquery。我现在应该知道坚持一个。