Chosen

Визуальный компонент-надстройка для <select>

HTML

<link rel="stylesheet" href="http://luxcore.tmweb.ru/1/Components/Chosen/chosen.css">
<script src="http://luxcore.tmweb.ru/1/Components/Chosen/chosen.jquery.min.js"></script>
<select class="chzn-select" data-placeholder="Chosen plugin" style="width: 150px;">
    <option value=""></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

<select class="chzn-select-deselect" data-placeholder="Chosen plugin" style="width: 150px;">
    <option value=""></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>


<select class="chzn-select" style="width: 350px;" multiple="" data-placeholder="Choose a Country">
    <option value=""></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

JavaScript

$(document).ready(function() {
    $(".chzn-select").chosen();
    $(".chzn-select-deselect").chosen({allow_single_deselect:true});
    $(".chzn-select").chosen({no_results_text: "Совпадений не найдено с"});
});