0

我正在通过 PHP将li元素动态添加到页面中。ul

<ul class="auto-suggest-list" id="theul"></ul>

然后使用 jquery,我为列表创建了一个自定义键盘导航(向上和向下)。

$(document).on('keyup', '.auto-suggest-textbox', function(e) {
    if($(this).val() != ''){
        $('.auto-suggest-list').slideDown();

        if(e.which == 38){
            position--;
            $('.auto-suggest-list').css('background-color','#fff');
            $('.auto-suggest-list li:nth-child(' + position + ')').css('background-color','#ddd');
        }
        else if(e.which == 40){
            position++;
            $('.auto-suggest-list').css('background-color','#fff');
            $('.auto-suggest-list li:nth-child(' + position + ')').css('background-color','#ddd');
        }

    }
    else if($(this).val() == ''){
        $('.auto-suggest-list').slideUp();
    }
});

#fff但是列表项的背景颜色会在一秒钟后恢复。背景颜色属性没有css,我还尝试了其他功能,例如text()在列表项上,它们都在不断恢复!

这是提供 li-s 的 PHP 代码的一部分

while($row=mysql_fetch_array($query_run)){
echo '<li>';
echo '<input type="hidden" value="'.$row['reciever_id'].'" name="recipients[]" />';
echo '<span>'.get_user_field('first_name',$row['reciever_id']).' '.get_user_field('last_name',$row['reciever_id']).'</span>';
echo '</li>';

}

4

1 回答 1

2

尝试替换以下两个实例:

$('.auto-suggest-list').css('background-color','#fff');

和:

$('.auto-suggest-list li').css('background-color','#fff');

jsFiddle在这里


您还可以替换这两行:

$('.auto-suggest-list li').css('background-color','#fff');
$('.auto-suggest-list li:nth-child(' + position + ')').css('background-color','#ddd');

和:

$('.auto-suggest-list li').css('background-color','#fff')
    .eq(position-1).css('background-color','#ddd');

jsFiddle 在这里链接

于 2013-08-30T19:05:23.057 回答