如何使用javascript将jsp包含在另一个jsp中
我有一个按钮注销。一旦注销被点击,我需要显示另一个页面。我怎样才能使用JavaScript做到这一点?谁能帮帮我吗?如何使用javascript将jsp包含在另一个jsp中
我的代码:
<s:form name="LogoutAction"
id="LogoutAction" action="logout">
<span class="inlayField2">
<s:a href="logout" cssClass="planTabHeader" id="logoutId"> <img src="../../KY/images/common/header/lock.png" alt="logout" style="border: none;background-color: transparent;" /> Log out</s:a></span>
</s:form>
我尝试这样做:
$('#logoutId').click(function(event) {
$('#logoutdiv').load('ConfirmationPopup.jsp');
});
你不能include
一个JSP输入反应中对客户端,因为它是一个服务器端技术的点击。您可以在发送之前在页面中包含所需的HTML,使用CSS隐藏该区域,然后使用JavaScript将其显示为可见,以响应使用JavaScript进行的鼠标点击。在页面发送到客户端之前,include
已经发生在服务器上。你可以有这样的事情:
<div id="confirmPopup" style="display:hidden;">
<%@ include file="ConfirmationPopup.jsp" %>
</div>
<script>
$('#logoutId').click(function(event) {
document.getElementById("confirmPopup").style.display="block";
});
</script>
你可以使用AJAX来从第二JSP在HTML,然后附加到DOM或一个元素的innerHTML。
主要Page.jsp与确认码
<span id=confirmSpan></span>
<script language="Javascript">
function xmlhttpPost(strURL, queryStr) {
var xmlHttpReq = false;
var self = this;
// Mozilla/Safari, opera etc
if (window.XMLHttpRequest) {
self.xmlHttpReq = new XMLHttpRequest();
}
// IE
else if (window.ActiveXObject) {
self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}else{
alert("no ajax")
return
}
self.xmlHttpReq.open('POST', strURL, true);
self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
self.xmlHttpReq.onreadystatechange = function() {
if (self.xmlHttpReq.readyState == 4) {
updatepageConfirm(self.xmlHttpReq.responseText);
}
}
self.xmlHttpReq.send(queryStr);
}
function updatepageConfirm(str){
document.getElementById("confirmSpan").innerHTML = str;
}
function logout1(){
xmlhttpPost("confirm.html");//http://sel2in.com/pages/prog/html/ajax/confirm.html", "")
}
</script>
</head>
<body>
<form id="search" action="/search" method="get">
<input type=button onclick=logout1() value=logout>
</form >
样品页面 - >为DIV任何有效的HTML可能是 confirm.jsp 做动作......你确定吗?跨度
// TODO形式在这里 HTML /弹出/脚本/ CSS - >就像一个iframe看起来要显示一个确认 - 一些用户界面问你是否真的要退出?最好的方法是创建一个id为“logoutConfirmSpan”的空跨度,然后点击注销,做ajax(异步模式 - > false,所以它发生内联)获取html标记并将其设置为innerHTML的跨度
该html应该是有效的,这样它会使用户界面显示并且形式才能真正注销。
见Replace inner HTML of a div with Ajax response告诉你如何使用Ajax与jQuery
简单的例子:
<span id = 'logoutConfirmSpan'> </span>
<script>
// call ajax, with the response call setHtmlForConfirm
function setHtmlForConfirm(req)
{
document.getElementById('logoutConfirmSpan').innerHTML = req.responseText;
}
//req.responseText should have the html to show the confirm UI and form to submit yes/ no
</script>
你可以更清楚一点,或者你可以请我给我举一些例子,因为我没有任何使用ajax的经验 – mukund 2013-04-23 08:26:49
对不起,我没有得到你 – mukund 2013-04-23 08:59:20
建议你去通过stacktrace http://stackoverflow.com/a/14851734/1643558你在问同样的事情 - 看到那里的答案。如果你想在AJAX上找到一些背景,请参阅http://www.quirksmode.org/blog/archives/2005/12/the_ajax_respon.html搜索“HTML片段” – tgkprog 2013-04-23 09:07:43
您可以使用一个简单的GET
请求获取由次级.jsp
页面呈现的HTML 。 基本上,从内阿贾克斯,使用jQuery你可以这样做:
$.get({
url: "mysite.com/otherpage.jsp",
data: "some data you want to send, optional",
success: function(data, textStatus, jqXhr)//the response data, the ajax request status and the ajax request object itself {
$('#someDiv').html(data);
}
});
1)创建
<div id='someID'></div>
同时按一下按钮初始页面加载2),直通JavaScript和你的新的JSP创建一个iframe 网址
3)一旦iframe内容的对话框 窗口中加载显示它作为一个弹出或许
你可以做到这一点,保持跨度和点击的另一种方法做: http://sel2in.com/pages/prog/html/ajax/aPage2.html1
<span id=confirmSpan></span>
<script language="Javascript">
function logout1(){
iconfirmSpan = document.getElementById("confirmSpan")
if (!confirmSpan){
alert("Error no confirmSpan contact support!");
}
confirmSpan.innerHTML = "<iframe src=\"http://sel2in.com/pages/prog/html/ajax/confirm.html\" height=400 width=700></iframe>"
//in real can keep height 1 width 1 and location off page if you want it just to load elements, scripts etc
}
</script>
</head>
<body>
<form id="search" action="/search" method="get">
<input type=button onclick=logout1() value="Do Action">
</form >
但是ajax对于工作流等来说更强大,但这可能是如果只有1个动作就够了 – tgkprog 2013-04-23 11:13:26
AJAX是你在找什么。
我强烈建议你用jQuery
(showcase -> div)执行AJAX
电话,但在Struts2
,你可以尝试用弃用第二Dojo
插件,无需下载任何库,只是为了让你的理念。
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
<head>
<sx:head/>
<script>
function loadAjax(){
var div = dojo.widget.byId("myDiv");
div.href = "yourAjaxAction.action";
div.refresh();
}
</script>
</head>
<body>
<input type="button"
value="Include a JSP fragment dynamically"
onclick="loadAjax();"/>
<sx:div id="myDiv"> </sx:div>
</body>
然后,你yourAjaxAction.action
必须返回成功的JSP代码段要包括的。
那么,你有没有遇到任何错误? – 2013-04-23 07:18:50
没有。我没有得到任何错误。页面没有得到加载 – mukund 2013-04-23 07:19:47
尝试检查在JavaScript控制台。 – 2013-04-23 07:20:15