以下是父jsp
的代码
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@page import="org.apache.jasper.tagplugins.jstl.core.ForEach"%>
<%@page import="java.util.Iterator"%>
<%@page import="com.sal.bean.CompanyBean"%>
<%@page import="java.util.List"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" href="styles.css">
<script src="http://code.jquery.com/jquery-latest.min.js"
type="text/javascript"></script>
<script src="script.js"></script>
<script>
/* function loadHTML(pageName) {
//alert(pageName);
var name = pageName + ".html";
//alert(name);
$('#my_div').load(name + ' #' + pageName);
//alert("2"); */
function loadHTML(pageName) {
var name = pageName + ".html";
$('#my_div').load(name);
}
</script>
</head>
<body>
<%
List<CompanyBean> cmpList = (List<CompanyBean>) request
.getAttribute("CompDtl");
Iterator itr = cmpList.iterator();
CompanyBean cmp = (CompanyBean) itr.next();
%>
<div
style="height: 100px; width: 101%; background: none repeat scroll 0 0 #80817D; margin: -15px 0px 0px -7px; border-radius: 10px;">
<ul style="list-style-type: none;">
<li
style="font-size: 72px; font-family: Verdana; margin-right: 30px; float: right;"><%=cmp.getComp_nm()%></li>
</ul>
</div>
<div style="margin: 0px 0px 0px -7px; border-radius: 10px">
<div id='cssmenu'
style="height: 100vh; width: 15%; float: left; background-color: gray;">
<div id='cssmenu'>
<ul>
<li class='active'><a href='#'><span>Home</span></a></li>
<li class='has-sub'><a href='#'><span>SETUP</span></a>
<ul>
<li onclick="loadHTML('Department')" id="dept"><a href='#'><span
id="dept">DEPARTMENT</span></a></li>
<li onclick="loadHTML('Contractor')"><a href='#'><span>CONTRACTOR</span></a></li>
<li onclick="loadHTML('Salary_mode')" class='last'><a
href='#'><span>SALARY MODE</span></a></li>
</ul></li>
<li class='has-sub'><a href='#'><span>About</span></a>
<ul>
<li><a href='#'><span>Company</span></a></li>
<li class='last'><a href='#'><span>Contact</span></a></li>
</ul></li>
</ul>
</div>
</div>
<div id="my_div" style="height:100vh; width:85%; float: left"></div>
</div>
</body>
</html>
以下是带有id = mydiv
的子div标签的子html的代码
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body onload="getDeptID()">
<div id=Department>
<script>
function getDeptID(){
alert("hello");
}
</script>
<form action="SalaryControl" method="post">
<div>
<div style="float: left;">
<span>Department Code</span>
</div>
<div>
<input type="text" id="dept_id" tabindex="-1" onFocus="this.blur()"
value="" />
</div>
</div>
</form>
</div>
</body>
</html>
当我成功从主JSP(父jsp页)中单击导航栏中的各个按钮时,孩子被加载,但是子html中的onload()函数均未执行。请帮助解决问题。
您并没有真正指定您在这里需要的内容,但是我认为您可以在不运行子页面中的函数的情况下完成此操作,而是在回调函数中调用函数。p>例如:
...
<link rel="stylesheet" href="styles.css">
<script src="http://code.jquery.com/jquery-latest.min.js"
type="text/javascript"></script>
<script src="script.js"></script>
<script>
function loadHTML(pageName) {
var name = pageName + ".html";
$('#my_div').load(name, function() {
//code that was in getDeptID()
alert("hello");
});
}
...
在回调中您可以做很多不同的事情,我敢肯定它可以做您真正需要的事情。
有关更多信息,请参见jQuery API加载功能。