Javascript 在单击链接时，在同一个jsp上异步将jsp包含在div中
我正在尝试实现一个用户帐户页面。在页面中，当我单击左侧的链接时，如“搜索用户”、“准备注释”等。我希望将相关jsp页面包含在下面显示的右侧div中 我首先使用了一个iframe来代替div，但是我可以将会话对象属性传递给iframe中加载的页面，因为iframe发送单独的http请求 我想在右边的div中使用jsp:include而不是iframe来显示相应的jsp页面。新的目标div将与iframe相同Javascript 在单击链接时，在同一个jsp上异步将jsp包含在div中,javascript,jquery,html,jsp,iframe,Javascript,Jquery,Html,Jsp,Iframe,我正在尝试实现一个用户帐户页面。在页面中，当我单击左侧的链接时，如“搜索用户”、“准备注释”等。我希望将相关jsp页面包含在下面显示的右侧div中 我首先使用了一个iframe来代替div，但是我可以将会话对象属性传递给iframe中加载的页面，因为iframe发送单独的http请求 我想在右边的div中使用jsp:include而不是iframe来显示相应的jsp页面。新的目标div将与iframe相同 <%@ page language="java" contentType="tex
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css">
<script src="${pageContext.request.contextPath}/js/jquery-1.11.2.min.js"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
<style>
#dashboard-iframe{
border: 1px solid gray;
height: 200px;
width: 200px;
}
</style>
<script type="text/javascript">
//jquery function i tried
(document).ready(function() {
$("#searchUser").click(function(){
$("#dashboard-iframe").load("${pageContext.request.contextPath}/searchuser");
});
});
//plain javascript
function searchClick(){
document.getElementById('dashboard-iframe').innerHTML=
"<jsp:include page="${pageContext.request.contextPath}/searchuser">";
}
</script>
</head>
<body onload="hidedisplay()">
<div class="panel panel-default">
<div class="panel-body">
<div class="list-group pull-left">
<a id="searchUser" onclick="searchClick()" href="#" class="list-group-item" target="dashboard-iframe">
<span class="glyphicon glyphicon-search"></span> Search Users
</a>
<a href="${pageContext.request.contextPath}/message_board" target="dashboard-iframe" class="list-group-item">
<span class="glyphicon glyphicon-inbox"></span> Message Board
</a>
<a href="${pageContext.request.contextPath}/prepare_notes" class="list-group-item" target="dashboard-iframe">
<span class="glyphicon glyphicon-list-alt"></span> Prepare Notes
</a>
<a href="${pageContext.request.contextPath}/UploadYourFile" target="dashboard-iframe" class="list-group-item">
<span class="glyphicon glyphicon-upload"></span> Share File
</a>
<a href="${pageContext.request.contextPath}/ComposeMessage" target="dashboard-iframe" class="list-group-item">
<span class="glyphicon glyphicon-envelope"></span> Compose Message
</a>
<a href="${pageContext.request.contextPath}/edit-profile" target="dashboard-iframe" class="list-group-item">
<span class="glyphicon glyphicon-pencil"></span> Edit Profile
</a>
<a href="${pageContext.request.contextPath}/connected-users" target="dashboard-iframe" class="list-group-item">
<span class="glyphicon glyphicon-link"></span> Connected Users
</a>
</div><!-- list-group end -->
</div>
</div>
<div id="dashboard-iframe">
<!-- Where i want to display the pages -->
</div>
</body>
</html>
在此处插入标题
#仪表板iframe{
边框：1px纯色灰色；
高度：200px；
宽度：200px；
}
//我试过的jquery函数
（文档）.就绪（函数（）{
$（“#searchUser”）。单击（函数（）{
$（“#dashboard iframe”）.load（“${pageContext.request.contextPath}/searchuser”）；
});
});
//纯javascript
函数searchClick（）{
document.getElementById（'dashboard-iframe'）.innerHTML=
"";
}
function searchClick(){
$('#dashboard-iframe').load('/searchuser');
}
.load（）从服务器加载数据并将返回的HTML放入匹配的元素。首先，我在代码中没有看到任何
iframeiframe<div id="dashboard-iframe">
<iframe></iframe>
</div>
如果你能解释一下你正在展示的代码是做什么的，以及为什么/如何回答这个问题，这将使你的答案更有用。对不起，这是我尝试过的版本…我真的不想要iframe，所以我没有添加iframe。我只想在div'dashboard iframe'中异步包含jsp页面。这样我就可以使用会话对象了。因为会话对象无法传递到iframe页面
$("#searchUser").click(function(){
$("#dashboard-iframe > iframe").attr("src", "${pageContext.request.contextPath}/searchuser");
});