使用selectize.js在您的下拉菜單中僅顯示三個輸入

Question

我正在使用selectize.js進行良好的下拉菜單，但是我試圖僅顯示三個結果，而不是完整的20個結果。因此，當用戶想要找到他需要輸入的內容時，除非他們是前三名之一。我還是Javascript的新手，我無法在其他有幫助的問題中找到答案。我已經把我的相關代碼放在下面。非常感謝！！

HTML

<div class="field"> 
    <%= f.label :homecity, "Home Town" %><br> 
    <%= f.select :homecity_id, Homecity.all.pluck(:Hometown, :id), {}, { class: "selectize1" } %> 
</div> 

Edit.js

$(document).on("turbolinks:load", function() { 
var selectizeCallback = null; 
$(".homecity-modal").on("hide.bs.modal", function(e) { 
if (selectizeCallback != null) { 
    selectizeCallback(); 
    selecitzeCallback = null; 
} 

$("#new_homecity").trigger("reset"); 
$.rails.enableFormElements($("#new_homecity")); 
}); 
$(".selectize1").selectize({ 

create: function(input, callback) { 
    selectizeCallback = callback; 


    $(".homecity-modal").modal(); 
    $("#homecity_Hometown").val(input); 
} 
}) 
}); 

Answer 1

selectize花費，提供你想要的東西 「maxOptions」 選項參數。

例如：

$(「.selectize1」).selectize({maxOptions: 3});