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

オートコンプリートには目的を達成するためのプロビジョニングはありませんが、ここでのこのトリックはうまくいく可能性があります-DIVに表示するためにjqueryオートコンプリートをカスタマイズする方法

于 2012-05-04T06:58:58.007 に答える