有这么两个图层,我用JS把JS查询后台得到的结果加到图层里。如果单独是这个的话,没问题
关键是我又加了个小窗口的图层,是JS定时查询后台,得到结果以小窗口形式显示,每当小窗口出来后就会影响到原先的图层,原先的图层好像移动了,位置发生了改变,是不是我的那些属性写得不太对
<div class=div_cont>
<div id="result"></div>
<div id="paging"></div>
</div>
不用细看,就看看那些图层,找了半天,不明白为什么
<%@ page language="java" pageEncoding="UTF-8"%>
<%if(request.getParameter("name")==null)
response.sendRedirect("dl.jsp");
String name=request.getParameter("name");
session.setAttribute("name",name); %>
<html>
<head>
<title>31231</title>
<script type='text/javascript'
src="${pageContext.request.contextPath}/dwr/engine.js"></script>
<script type='text/javascript'
src="${pageContext.request.contextPath}/dwr/util.js"></script>
<script type='text/javascript'
src="${pageContext.request.contextPath}/dwr/interface/searchService2.js"></script>
<script type='text/javascript'
src="${pageContext.request.contextPath}/dwr/interface/searchService.js"></script>
<style type="text/css">
.div_cont {
width: 1000px;
float: left;
margin: 10px;
}#result {
width: 800px;
float: left;
margin-top: 5px;
}#paging {
width: 800px;
float: left;
margin-top: 5px;
}
</style>
<script language="javascript">
var request;
var minpage;
var maxpage;
var startindex;
var hasnext; function doSearch(type) {
var result = document.getElementById("result");
var pagingdiv = document.getElementById('paging');
result.innerHTML = "";
pagingdiv.innerHTML = ""; if (type != 'paging') {
var startindexinput = document.getElementById('startindex');
startindexinput.value = "1";
} request = {
startindex : 1,
query : ""
};
DWRUtil.getValues(request);
//DWREngine.setAsync(true);
if (request.query == "") {
alert("请输入正确的词");
} else {
searchService.getSearchResults(request, fillPage);
}
//DWREngine.setAsync(false);
} function fillPage(data) { // alert(DWRUtil.toDescriptiveString(data, 2)); var resultdiv = document.getElementById('result');
var pagingdiv = document.getElementById('paging'); resultdiv.innerHTML = "";
pagingdiv.innerHTML = ""; if (data.length == 0) {
resultdiv.innerHTML = "<span>sorry, we can't find what you want...</span>";
return;
} if (null != data) { for ( var i = 0; i < data.length; i++) {
//alert(data[i].id);
var results = data[i];
//alert(results);
var ele = document.createElement('div');
ele.setAttribute('id', 'info' + i);
ele.innerHTML = "<span>loading..</span>";
resultdiv.appendChild(ele);
var res = document.getElementById('info' + i);
//res.innerHTML="<font color=\"#0033CC\">" + title[i] + "</font><br /><a href=\"" + url[i] + "\">"
res.innerHTML = "<a href=\"" + data[i].url + "\">"
+ "<font color=\"#0033CC\">" + results.title
+ "</font></a><br /><font color=\"#008000\">"
+ data[i].content + "</font><br /><br /><br />";
//searchService.getSearchResultById(list[i],fillDetailResult);
//res.innerHTML=id[i];
//res.innerHTML=data[i].url+data[i].title+data[i].content+data[i].id;
resultdiv.appendChild(res);
}
}
minpage = data[0].minpage;
maxpage = data[0].maxpage;
//minpage=data.startpage;
//maxpage=data.endpage;
startindex = data[0].startindex;
hasnext = data[0].hasnext; if (minpage != 1) {
var link = document.createElement('a');
link.setAttribute("href", "javaScript:paging('"
+ ((minpage - 11) * 10 + 1) + "')");
link.innerHTML = "first 10 pages<<";
}
for ( var j = minpage; j <= maxpage; j++) {
if ((j - 1) * 10 + 1 != startindex) {
var link = document.createElement('a');
link.setAttribute("href", "javascript:paging('"
+ ((j - 1) * 10 + 1) + "')");
link.innerHTML = " " + j + " ";
pagingdiv.appendChild(link);
} else {
pagingdiv.innerHTML += (" " + j + " ");
}
} if (hasnext == 1) {
var link = document.createElement('a');
link.setAttribute("href", "javascript:paging('"
+ (maxpage * 10 + 1) + "')");
link.innerHTML = ">>last 10 pages";
pagingdiv.appendChild(link);
}
} function paging(newindex) {
document.getElementById('startindex').value = newindex;
doSearch('paging');
}
function handlekey() {
if (document.getElementById('query').value == '')
return;
var intkey = -1;
if (window.event) {
intKey = event.keyCode;
if (intKey == 13) {
doSearch('');
}
}
} window.onload = init; function init() {
var time = window.setInterval(search2, 10000);
} function search2() {
searchService2.getSearchResults(filldiv);
} function filldiv(data) {
show(data);
} var isshow = 0;//0小窗口没有显示,1小窗口已显   function creatediv() {
var msgw, msgh, bordercolor;
msgw = 300;//提示窗口的宽度  
msgh = 300;//提示窗口的高度  
var msgObj = document.createElement("div");
msgObj.setAttribute("id", "msgDiv");
msgObj.style.position = "absolute";
msgObj.style.background = "#fff";
msgObj.style.overflow = "auto";
msgObj.style.left = "900px";
msgObj.style.bottom = "10px";
msgObj.style.width = msgw + "px";
msgObj.style.height = msgh + "px";
msgObj.style.zIndex = "10001";
document.body.appendChild(msgObj);
}
function delWinD() {
document.getElementById("msgDiv").style.display = "none";
isshow = 0;
}
function show(data) {
isshow = 1;
if (!document.getElementById("msgDiv"))//小窗口不存在  
{
creatediv();
mes(data);
} else {
mes(data);
document.getElementById("msgDiv").style.display = "";
document.getElementById("msgDiv").style.bottom ="10px";
//document.getElementById("msgDiv").style.top = (document.documentElement.clientHeight / 4)
// + "px";
}
} function mes(data) { var msgObj = document.getElementById('msgDiv');
msgObj.innerHTML = "";
msgObj.innerHTML = "这是弹出的小窗口!<br /><a href=\"javascript:void(0);\" onclick='delWinD();return false;'>点我关闭窗口</a>";
if (data.length == 0) {
msgObj.innerHTML = "<span>sorry, we can't find what you want...</span>";
return;
} if (null != data) { for ( var i = 0; i < data.length; i++) {
var results = data[i];
var ele = document.createElement('div');
ele.setAttribute('id', 'info' + i);
msgObj.appendChild(ele);
var res = document.getElementById('info' + i);
res.innerHTML = "<a href=\"" + data[i].url + "\">"
+ "<font color=\"#0033CC\">" + results.title
+ "</font></a><br /><font color=\"#008000\">"
+ data[i].content + "</font><br /><br /><br />";
msgObj.appendChild(res);
}
}
}
</script>
</head>
<body>
<input type="hidden" name="startindex" id="startindex" value="1"><div id="searchbar">
<table align="center">
<tr align="center">
<td><img alt="" src=""></td>
</tr>
<tr align="center">
<td><input size="50" type="text" name="query" id="query" value=""
onkeyup="handlekey()"> <input type="button" value="Search"
id="search" onclick="javascript:doSearch('')"></td>
</tr>
</table>
</div>
<hr><div class=div_cont>
<div id="result"></div>
<div id="paging"></div>
</div>
</body>
</html>