動的に更新データリスト、私は次のスクリプトでは、ユーザーのタイプとして、動的にHTML5のデータリストを更新しています

Question

は表示されません。

$('#place').on('keyup', function() { 
    $.post('content/php/autocomp.php', { field: 'plaats', val: $('#place').val() }).done(function(response) { 
     $('#autocomp-places').html(response); 
    }); 
}); 

データリストは、多くの場合、すぐに表示されていないことを除いて正常に動作します。要素を調べるとhtmlはありますが、データリストは更新されるとすぐに表示されません。どのように私はそれを強制的に表示することができますか？

記録のために：うまくいきました。私は今すぐ新しい提案をすぐに表示したいと思います。

Answer 1

私はちょうどこれのまともな回避策を見つけたと思います！ここで

は私の擬似コードです：

1. 私が入力すると、私は、データを取得するために非同期httprequestsを作ります。
2. データが返されると、私はデータリストをクリアして再設定します。
3. 現在の入力フィールドにまだフォーカスがある場合は、手動で.focus()を入力要素にコールします（これにより、データリストのポップアップ動作が強制的に実行されるようです）。

Answer 2

ajaxメソッドの代わりにsuccessを使用して、もう一度やり直してください。

$('#place').on('keyup', function() { 
    $.post('content/php/autocomp.php', { 
     field: 'plaats', 
     val: $('#place').val() 
    }).success(function (response) { 
     $('#autocomp-places').html(response); 
    }); 
}); 

Answer 3

まず、私はそのようなjQuery UI autocompleteとして、すでに利用可能なソリューションのいずれかを使用しようとするだろう。開発時間を短縮し、コードに典型的なバグをなくします（将来他の人が働くことによるメリットを得ることはもちろん）。

あなたが本当にあなた自身のバージョンを作成したい場合は、私はリストがクリアされ、次のコードで再作成されていることを確認します：

$('#place').on('keyup', function() { 
    var posting = $.post('content/php/autocomp.php', { field: 'plaats', val: $('#place').val() }); 
    posting.done(function(data) { 
    $('#autocomp-places').empty().append(data); 
    }); 
});