3

ページの上部に検索ボックスがあります。ajax を使用して、ページ上に div をドロップダウンして検索結果を表示する必要があります。重要なことは、検索結果をページの下に押し込むのではなく、下に重ねて表示することです。このため、検索ボックスの下に 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>
4

2 に答える 2

1

結果divを絶対に配置する必要があります。

お気に入り ：

<div id="results" style="position:absolute">
于 2012-11-24T15:50:19.780 に答える
1 
<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>

相対位置と絶対位置は解決策を見つけるのに役立ちます。同時に、オンロードすると、divを非表示にする必要があり、検索結果が表示されたら、再度表示する必要があります。

于 2012-11-24T15:51:02.840 に答える