问题 如何在运行时动态地在另一个ASPX的DIV中显示ASPX?


这是我在ASP.NET中尝试做的事情:

创建一个名为Main.aspx的页面。此页面有一个DIV和一个按钮。

浏览器加载Main.aspx。然后当我单击按钮时,我想动态地将页面Page99.aspx加载到Main.aspx中的DIV中,但是没有Main.aspx需要回发。

因此,Main.aspx加载一次,此后Main.aspx中显示的所有内容将来自不同的.aspx页面。

PS。 我正在寻找上面的解决方案,但不使用框架。

更新1 我应该提一下,Page99不是一个简单的HTML页面。它将包含Web控件。


10526
2018-01-20 05:20


起源

有人对使用祖先类有一个很好的答案,但遗憾的是它似乎已被删除。那个人可以带回答案吗? - Liao


答案:


据我所知,除非使用iframe,否则无法将一个aspx页面加载到另一个页面中。

使用回发或ajax,您可以使用UserControls(ascx)。它们可以包含几乎相同的页面内容,或者使用MasterPage。

如果你希望没有回发,ajax可能是要走的路,尽管如此,它不允许你将aspx页面加载到另一个页面,只是为了改变你所在页面的内容(除其他外)。

我不确定其他用于Web开发的平台,他们可能有一个更接近你想做的解决方案,所以如果asp.net不是“必须”,你应该考虑检查其他平台。


4
2018-01-20 05:34



那么,如果Page99是一个用户控件,那么当使用AJAX单击Button时,这个“嵌入”可以在运行时完成吗? [你能否指出一些你知道的例子,因为我无法找到关于这样做的任何具体信息(找到有关包含的信息,但这不符合我的情况)。] - Liao
@Liao - 您应该阅读有关UpdatePanel的信息: asp.net/Ajax/Documentation/Live/overview/... - SirDemon
我读了一下,但并不多;会对此做更多的阅读(显然在某些情况下它很慢)。 - Liao
ascx可能是最好的方法,但有些方法可以使用jquery.load将aspx页面加载到另一个页面中,或者查看下面的答案 - stackoverflow.com/a/2099318/2340825 - BA TabNabber


如果您不想使用iFrame,您可以很好地使用HTML的Object元素。按照这里查看和html示例。你可以很好地使用它来为aspx做一些改变,比如使用OnClientClick属性来获取aspx按钮等。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>mouseover image position</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />

<style type="text/css">
/*<![CDATA[*/
body
   {
    background-color:#aaaaff;
   }
#one
   {
    position:absolute;
    left:50%;
    top:50%;
    margin:-150px 0 0 -250px;
   }
object
   {
    width:500px; 
    height:300px; 
    border:solid 1px #000000;
   }
 /*//]]>*/
</style>

<script type="text/javascript">
//<![CDATA[
// written by: Coothead
function updateObjectIframe(which){
    document.getElementById('one').innerHTML = '<'+'object id="foo" name="foo" type="text/html" data="'+which.href+'"><\/object>';
}

//]]>
</script>

</head>
<body>

<div id="one">
<object id="foo" name="foo" type="text/html" data="http://www.w3schools.com/"></object>
</div>
<div>
<a href="http://www.google.com" onclick="updateObjectIframe(this); return false;">this is an object test not an iframe test</a>
</div>

</body>
</html>

6
2018-01-20 05:51



这太棒了,非常简单!顺便说一句,当事情有一个简单的解决方案时,有时候你会想到“它会如此简单!”。在这种方法中你能想到任何陷阱/警告吗? - Liao
这种方法的一个可能的缺陷(如果你的内页确实是aspx)是你的viewState和两页的回发可能会相互冲突,虽然有解决方法。 - BA TabNabber
通常HTML方法不起作用。就我而言,它无法呈现报告URL。这似乎是跨脚本问题,但是当通过管理员帐户访问时,它正在通过IIS托管页面。我面对这个问题,需要采取其他方法。 - CRM Anish


如果您正在使用AJAX工具包,则可以使用webcontrol而不是ASPX页面来执行此操作。

如果你试图使用ASPX页面来实现这个想法,而不使用iframe,你会发现没有为javascript变量名和元素id提供隔离,因此如果你使用innerHTML将渲染的aspx内容放入div中,几乎可以保证冲突;该页面肯定无法像我想象的那样执行部分回发。

使用webcontrol:更好的解决方案是安装AJAX工具包(如果尚未安装),并使用updatepanel控件。在此面板中动态加载和卸载webcontrol(使用LoadControl()),或在其中放置Multiview控件并更改activeview以模拟更改此内容。

updatepanel将允许其内容在没有完整回发(页面刷新)的情况下进行更新。


1
2018-01-20 06:07





也许我错过了一些东西。但你可以使用 UFrame 在这种情况下。

http://msmvps.com/blogs/omar/archive/2008/05/24/uframe-goodness-of-updatepanel-and-iframe-combined.aspx


0
2018-01-20 05:37



UFrame仍然使用iframe,根据问题,这不是一个选项。 - SirDemon
@SirDemon,UFrame不使用IFrame作为本文中提到的Omar。 codeproject.com/KB/aspnet/uframe.aspx - Mehdi Golchin


我认为你可以使用AJAX和服务器上的Web方法来做到这一点。

页面上的按钮使用AJAX调用Web方法,并使用各种参数将正确的页面加载到DIV中。 Web方法使用普通Web请求加载正确的页面。

例如:

HttpWebRequest request = (HttpWebRequest)WebRequest.Create("http://servername/filename.aspx");
WebResponse response = request.GetResponse();

然后该方法将ASPX文件生成的HTML返回给客户端。 当客户端获得回调时,它可以解码HTML并将其放入div中。

例如:

var startOfHTML = response.indexOf('&lt;');
var endOfHTML = response.indexOf('</string>');

response = response.substring(startOfHTML, endOfHTML);
response = response.replace(/&lt;/g, "<");
response = response.replace(/&gt;/g, ">");

var div = document.getElementById("myDIV");
div.innerHTML = response;

0
2018-01-20 05:59



我想这可行;但我想如果Page99上有Web控件,那么这种方法将无效。我对吗? - Liao
您最终会尝试在页面中插入多个html,body和head标签。视图状态字段也会重复,因此回发可能不再有效,正如您正确指出的那样,对Page99的控制(如果有效)会导致整个页面回发,并且肯定不会获得必要的回发信息路由回到page99,但最终会以父页面结束(可能导致“正在加载视图状态的控制树必须与用于在上一个请求期间保存视图状态的控制树匹配”错误) - Martin Booth
@Martin,非常好点。我假设基于缺少框架,“儿童”页面是非常基本的。这个问题已经更新。 - Coxy