jquery - 如何让div位于页面顶部

Question

我创建了一个自动建议脚本，我将在我的网站上使用它。问题是，在我创建自动建议的手册中，他们使用 div 来产生相关结果。

当我使用 div 时，它会覆盖我的所有页面并破坏其顺序。 我正在寻找一种使 DIV 显示在页面顶部的方法。

代码 - 有一些伪代码。

//function that uses jquery and ajax to update the autosuggest elements on key up
<input type="text" name="field1" />
<div name="auto_suggest"> </div>

提前致谢。

编辑:这是代码:

$(document).ready(function(){
$('.autosuggest').keyup(function(){

    var search_term = $(this).val();
    $.post('shit5.php', {search_term:search_term}, function(data){
        $('.result').html(data);

        $('.result li').click(function(){
            var result_value = $(this).text();
            $('.autosuggest').val(result_value);
            $('.result').html('');

        });
    });

});
});

Answer 1

在您编辑的问题(使用 $.post 代码)中，我看到您在 .autosuggest 上有一个 keyup 监听器。我认为它应该在输入上:

$('input[name=field1]').keyup(function(){

然后只需使用您需要的 CSS 为 .autosuggest 提供一个类即可。 如果你想用 jQuery 来做到这一点，你可以:

$('div[name=auto_suggest]').css({
   'position' : 'absolute',
   top: '0px',
   left: '0px'
});

但最好的方法是使用该 CSS 创建一个类并将其添加/删除到 div 中。我想 div 应该从一开始就被隐藏。

编辑:

要将其放置在输入字段附近，您还可以使用以下命令:

$('input[name=field1]').keyup(function(){
    var thisposition = $(this).position();
    ...

然后将该位置分配给.autosuggest，例如:

$('div[name=auto_suggest]').css({
   'position' : 'absolute',
   top: eval (thisposition.top - 15) + 'px',
   left:thisposition.left + 'px',
});