当通过javascript更改iframe src时,整个页面都会刷新



在我的 asp.net 应用程序中,我有一个有两个iframe的页面。在这些框架上方是几个链接按钮。点击这些按钮时,它们应该更改两个 iframe 的 src。下面列出的是我用来执行此操作的客户端代码和 JavaScript。问题是当点击这些按钮中的任何一个时,不仅仅是更改其中一个 iframe 的 src,而是整个页面刷新。(我可以说这是令人耳目一新的,因为链接按钮在您登录主框架中显示的第一页之前不可用,在您登录后,按钮通过调用父级 - window.parent.loginSuccess() 变得可见)。如果单击其中一个按钮,它会将您发送回 iframe 中的登录页面,并且按钮不再可见。这是代码,有人明白为什么会发生这种情况吗?谢谢你的帮助。

<body id="bodysty">
<div id="fstyle" class="daform">
    <form id="form1" runat="server">
    <div id="master">
    <div id="topthing"> <asp:LinkButton ID="lbtnControlPanel" onclientclick="CPhit()" runat="server" style="display:none">Control Panel</asp:LinkButton> <asp:LinkButton ID="lbtnAddClient" runat="server" onclientclick="AddClientHit()" style="display:none">Add Client</asp:LinkButton> <asp:LinkButton ID="lbtnManageClients" runat="server" onclientclick="ManageClientsHit()" style="display:none">Manage Clients</asp:LinkButton> <asp:LinkButton ID="lbtnAdmin" runat="server" onclientclick="ManageClientsHit()" style="display:none">Admin Options</asp:LinkButton></div>
    <div id="leftcontrol">
    <iframe id="LeftIframe" runat="server" ></iframe>
        </div>
    <div id="mainbodyform">
    <iframe id="ContentIframe" runat="server" src="Login.aspx" class="mainiframe" ></iframe>
    </div>
    </div>
    </form>
    </div>
</body>
</html>
<script language="javascript">
    function CPhit() {
        document.getElementById("ContentIframe").src = "LoginNotes.aspx";
    }
    function AddClientHit() {
        document.getElementById("ContentIframe").src = "NewCustomer.aspx";
    }
    function loginSuccess() {
        document.getElementById('lbtnControlPanel').style.display = 'inherit'
        document.getElementById('lbtnAddClient').style.display = 'inherit'
        document.getElementById('lbtnManageClients').style.display = 'inherit'
        document.getElementById('lbtnAdmin').style.display = 'inherit'
    }
</script>

代码隐藏中没有处理此页面的代码,它仅用于导航。有什么想法吗?谢谢你的帮助。

您需要取消正在单击的项目的默认单击操作。

简单的方法是在单击事件上返回 false。

onclientclick="CPhit(); return false;" 

更好的方法是防止默认()

它可能与按钮的行为有关 尝试

event.stopPropagation() or  window.event.cancelBubble = true 

在您的 JS 函数中

最新更新