Question

在我的网页（例如Link1：http://localhost:8086/MyStrutsApp/login.do）中，我有几个链接。当用户点击其中一个链接时，他将被带到另一个页面（例如link2：http://localhost:8086/MyStrutsApp/AddBook.jsp）以填写html表单。

现在我想要实现的是当任何用户点击链接时，该html表单（Link2）显示在同一页面上（即Link1）。

我不知道如何实现这一点。

Answer 1

实现此目的的AJAX方法如下：

您的原始页面上有一个DIV将被替换（即，内容只在原始上下文中有意义或完全为空）
您的Link2 servlet仅生成上述DIV的内容（而不是该页面的内容）
您使用一小部分Javascript来进行AJAX调用并使用响应填充DIV。

如果您想使用Dojo，HTML页面将如下所示：

<!-- main content -->
<div id="leftpanel">
    <h3>This content will be replaced</h3>
    You can <a href="#" onClick="updateFromURL('/MyStrutsApp/AddBook.jsp)">add a book</a>
</div>

Javascript代码如下所示：

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.xd.js" type="text/javascript"></script>
<script type="text/javascript">
function display_wait(s) {
  var mainPanel=dojo.byId("leftpanel");
  mainPanel.innerHTML='<div class="waitingmsg">'+s+'</div>';
}

function updateFromURL(url) {
    display_wait("loading content");
    dojo.xhrGet({url:url,
                load:function(result) {
                dojo.byId('leftpanel').innerHTML=result;
            }});
}
</script>

（正如Rafa所说，你可以使用相同的技术在对话框中显示新部分）

Answer 2

您始终可以使用jQuery来显示对话框... http://jqueryui.com/demos/dialog/

使用AJAX检索页面并将其显示在对话框中。

Answer 3

要在另一个页面中显示一个页面，请使用iframe。请参阅iframe docs。

要在外部网页上建立链接，将其目标网页加载到iframe，请为iframe提供name属性，并为该链接指定匹配的target属性

在同一页面上显示页面数据而不将其转发到另一页面

3 个答案: