親ウィンドウからjspページのdivタグを非表示にして表示したいのですwindow.open()が、子ウィンドウの参照を取得するよりもそれを使用している場合はopenを使用したくないので、子ウィンドウのjavaスクリプト関数を実行します。問題の原因 ウィンドウが最初に読み込まれ、java スクリプト関数が実行され、div タグを非表示にするのに時間がかかるか、すべての div タグが表示されるので、親ウィンドウから div タグを表示および非表示にできるように、他の解決策を教えていただくか、ロジックを操作してください。非常にスムーズ。私の要件は、新しいウィンドウを開くのではなく、ホームページのボタンをクリックしてdivタグが表示されているため、すべてのdivタグが存在する新しいタブを開くことです
これは私のJavaスクリプトのロジックです
function showDiv(id) {
var div1 = document.getElementById('div1');
var div2 = document.getElementById('div2');
var div3 = document.getElementById('div3');
// Check what the value of the button pressed and displays the correct div
if (id == 1)
div1.style.display = 'block';
if (id == 2) {
div2.style.display = 'block';
}
if (id == 3) {
div3.style.display = 'block';
}
}
これは子jspです
<script type="text/javascript">
function showDiv(id) {
var div1 = document.getElementById('div1');
var div2 = document.getElementById('div2');
var div3 = document.getElementById('div3');
// Check what the value of the button pressed and displays the correct div
if (id == 1)
div1.style.display = 'block';
if (id == 2) {
div2.style.display = 'block';
}
if (id == 3) {
div3.style.display = 'block';
}
}
function doAllThese(url) {
if (url == 'FindById') {
document.form.action = "/EmployeeWebSpring/search/FindById";
self.close();
}
if (url == 'FindByName') {
document.form.action = "/EmployeeWebSpring/search/FindByName";
}
if (url == 'FindByDeptNO') {
document.form.action = "/EmployeeWebSpring/search/FindByDeptNO";
}
}
</script>
</head>
<body>
<form:form name="form" commandName="employeeForm" method="post">
<div id="div1" style="display: block;">
Employee_ID:
<form:input path="employeeNumber" />
<input type="submit" name="method" value="FindById" id="FindById"
onclick="doAllThese(this.value)" />
</div>
<div id="div2" style="display: none;">
Employee_Name
<form:input path="firstName" />
<input type="submit" name="method" value="FindByName"
onclick="doAllThese(this.value)" /> <br />
<font size=3>For Searching the employees by<b>Employee
Name</b><br />you can use % match all the records with the given
pattern
</font><br /> <font size="2"> <i>e.g <b> for search by</b>EmployeeName<br />
matches alL the employees whose name starts with character <b>S</b></i></font>
</div>
<div id="div3" style="display: none;">
Employee_Name
<form:input path="departmentId" />
<input type="submit" name="method" value="FindByDeptNO"
onclick="doAllThese(this.value)" />
</div>
</form:form>
</body>
</html>
これは私のhome.jspです
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!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">
<link href="../css/styles.css" rel="stylesheet" type="text/css">
<title>Home</title>
<script type="text/javascript">
function LoadByName(windowHeight, windowWidth) {
var centerWidth = (window.screen.width - windowWidth) / 2;
var centerHeight = (window.screen.height - windowHeight) / 2;
var newWindow = window.open('../search/searchPage', 'mywindow',
'resizable=0,width=' + windowWidth + ',height=' + windowHeight
+ ',left=' + centerWidth + ',top=' + centerHeight);
alert("Name window");
newWindow.showDiv(2);
}
function LoadById(windowHeight, windowWidth) {
var centerWidth = (window.screen.width - windowWidth) / 2;
var centerHeight = (window.screen.height - windowHeight) / 2;
var newWindow = window.open('../search/searchPage', 'mywindow',
'resizable=0,width=' + windowWidth + ',height=' + windowHeight
+ ',left=' + centerWidth + ',top=' + centerHeight);
alert(newWindow);
newWindow.showDiv(1);
}
function LoadByDeptNo(windowHeight, windowWidth)
{
var centerWidth = (window.screen.width - windowWidth) / 2;
var centerHeight = (window.screen.height - windowHeight) / 2;
var newWindow = window.open('../search/searchPage', 'mywindow',
'resizable=0,width=' + windowWidth + ',height=' + windowHeight
+ ',left=' + centerWidth + ',top=' + centerHeight);
alert(newWindow);
newWindow.showDiv(3);
}
</script>
</head>
<jsp:include page="Header.jsp"/>
<p> </p>
<br>
<br>
<body>
</body>
</html>
これはheader.jspです
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link href="../css/styles.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<img src="../images/Header.png" width="1250" height="120" />
<div id='cssmenu'>
<ul>
<li class='active '><a href='index.html'><span>Home</span></a></li>
<li class='has-sub '><a href='#'><span>NewEntity</span></a>
<ul>
<li><a href='#'><span>Department</span></a></li>
<li><a href='#'><span>Employee</span></a></li>
<li><a href='#'><span>Project</span></a></li>
</ul></li>
<li class='has-sub '><a href='#'><span>FindEmployee</span></a>
<ul>
<li><a href="javascript:LoadById(250,500)"><span>FindEmployeeById</span></a></li>
<li><a href="javascript:LoadByName(250,500)"><span>FindEmployeeByName</span></a></li>
<li><a href=' javascript:LoadByDeptNo(250,250)'><span>FindByDepartmentId</span></a></li>
<li><a href="/EmployeeWebSpring/search/GetAllEmployee"><span>GetAllEmployee</span></a></li>
</ul></li>
<li class='has-sub '><a href='#'><span>FindDepartment</span></a>
<ul>
<li><a href="javascript:department()"><span>FindDepartmentById</span></a></li>
<li><a href="javascript:LoadByName(250,500)"><span>FindDepartmentByName</span></a></li>
<li><a href="../department/GetAllDepartment"><span>GetAllDepartment</span></a></li>
</ul></li>
<li><a href='#'><span>About</span></a></li>
<li><a href='#'><span>Contact</span></a></li>
</ul>
</div>
</body>
</html>