1

我创建了一个将在我的网站上使用的自动建议脚本。问题是，在我创建自动建议的手册中，他们使用了一个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('');

        });
    });

});
});
4

2 回答 2

3

在您编辑的问题（使用 $.post 代码）上，我看到您在.autosuggest. 我认为它应该在输入上：

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

.autosuggest然后用你需要的 CSS给一个类。如果你想用 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',
});
于 2013-08-11T09:16:37.983 回答
0

试试这个，它为页面提供了一点动画：

$('div[name=auto_suggest]').css({'position' : 'absolute'}).animate({top: '0px',left: '0px'}, 1000);
于 2013-08-11T09:33:10.103 回答