javascript/php div下拉搜索结果

我有一个搜索框在页面的顶部。使用Ajax我想要一个div下拉页面以显示搜索结果。关键是我希望搜索结果覆盖下面的页面，而不是推下去。出于这个原因，我不能只在搜索框下面有一个div。我需要做一些更复杂的事情 - 但我不确定是什么。javascript/php div下拉搜索结果

以下代码在搜索框下面填充div。任何人都可以建议一种经济的方式来让div浏览页面，而不是把所有东西都推下来。感谢您的任何建议！

的JavaScript

function showResults(str) { 

document.getElementById("results").innerHTML=xmlhttp.responseText; 
document.getElementById("results").style.border="1px solid #A5ACB2"; 

//some ajax 

xmlhttp.open("GET","search.php?str="+str,true); 
xmlhttp.send(); 
}

HTML

<html> 
<body> 
<table><tr><td><img src="logo.gif"></td><td> 
<input type="text" id="string" onkeyup="showResults(this.value)"> 
<div id="results"></div><td></tr> 
<tr><td colspan=2 
Main body of page. All sorts of text and html go here that I do not want pushed down. 
</td></tr></table> 
</body> 
</html>

来源

2012-11-24 user1260310

绝对可以。 – j08691

绝对定位div吗？ – user1260310

<html> 
<body> 
<table><tr><td><img src="logo.gif"></td><td style="position:relative"> 
<input type="text" id="string" onkeyup="showResults(this.value)"> 
<div id="results" style="position:absolute"></div><td></tr> 
<tr><td colspan=2 
Main body of page. All sorts of text and html go here that I do not want pushed down. 
</td></tr></table> 
</body> 
</html>

位置相对和绝对会帮助你找到解决方案，并在同一时间，onload事件，你需要隐藏的div，一次搜索结果中，你必须再次展示它。

来源

2012-11-24 15:51:02

这有帮助。结果覆盖页面。但是，它们是透明的，所以页面显示。另外，他们不会呆在桌子里，而是一直走到屏幕的右侧。我需要以某种方式格式化div吗？ – user1260310

由于绝对的位置，你可以相对于它的TD位置，为什么你变得透明，这意味着你已经给了一些透明的地方。你能分享代码吗？ –

据我所知，我还没有透明。只是添加在样式

。我可以在课堂上使用CSS来设计div的样式吗？此外，当您在框外单击时，需要一种方法使下拉消失，而目前它不会。 – user1260310

你必须绝对定位你的结果股利。

像：

<div id="results" style="position:absolute">

来源

2012-11-24 15:50:19

javascript/php div下拉搜索结果

回答

相关问题