EasyAutocompleteと入力の幅

Question

入力フィールドにbehavior = 'autocomplete'を追加すると、ブラウザ/スクリーンのサイズ変更によって幅が変更され、スケーリングがなくなります。

easyAutocompleteで経験を積んだ人に同じ問題がありますか？

ありがとうございました。

データ-行動せずにこのコードは、 "オートコンプリート" は応答しない=

<form> 
    <input class="form-control" type="text" placeholder="search"> 
    </form> 

データ-行動とこのコード応答する

<form> 
    <input class="form-control" type="text" placeholder="search" data-behavior="autocomplete"> 
    </form> 

http://easyautocomplete.com - jQueryのオートコンプリートのプラグイン

Answer 1

することができます以下のような簡単なオートコンプリートを使用して、データビヘイビアを入れる必要はありません。 また、easy-autocompleteライブラリによって適用されたCSSを上書きする必要があります。

var options = { 
 
data: ["blue", "green", "pink", "red", "yellow"] 
 
}; 
 

 
$("#example").easyAutocomplete(options);

.easy-autocomplete{ 
 
    width:100% !important 
 
} 
 

 
.easy-autocomplete input{ 
 
    width: 100%; 
 
} 
 

 
.form-wrapper{ 
 
    width: 500px; 
 
}

<link href="https://unpkg.com/easy-autocomplete@1.3.5/dist/easy-autocomplete.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://unpkg.com/easy-autocomplete@1.3.5/dist/jquery.easy-autocomplete.js"></script> 
 

 
<form class="form-wrapper"> 
 
    <input id="example" class="form-control" type="text" placeholder="search"> 
 
</form>