0

我想在单独的 中显示建议的自动完成div,而不是显示在指定的自动完成小部件上的弹出菜单。这样做的原因是:我们使用自动完成来帮助用户看到他们即将尝试重复输入。当他们在输入字段中键入时,一个 div 将显示渐进匹配。

我正在使用带有远程数据源的自动完成示例代码“birds”进行测试:

<script>
  $(function() {
    function log( message ) {
      $( "<div/>" ).text( message ).prependTo( "#log" );
      $( "#log" ).scrollTop( 0 );
    }

  $( "#birds" ).autocomplete({
    source: "search",
    minLength: 2,
    select: function( event, ui ) {
      log( ui.item ?
        "Selected: " + ui.item.value + " aka " + ui.item.id :
        "Nothing selected, input was " + this.value );
      }
    });
  });
</script>
4

2 回答 2

1

你的意思是这样的:

$(function() {
    function log( message ) {
      $( "<div/>" ).text( message ).prependTo( "#log" );
      $( "#log" ).scrollTop( 0 );
    }

  $( "#birds" ).autocomplete({
    source: "search",
    minLength: 2,
    select: function( event, ui ) {
      $('.newDiv ul').empty();
      },
     change: function(event, ui) {
        $('.newDiv ul').empty();
     }
    }).data('autocomplete')._renderItem = function(ul, item) {    
      return $('<li/>')
        .data('item.autocomplete', item)
        .append(item.value)
        .appendTo($('.newDiv ul'));
    };
  });

html:

<div class="newDiv"><ul></ul></div>
于 2012-05-04T06:45:37.300 回答
1

虽然自动完成中没有规定可以实现您想要的,但这里的这个技巧可能对您有用 -如何自定义 jquery 自动完成以在 DIV 中显示

于 2012-05-04T06:58:58.007 回答