The use of jquery plug-in chosen

I. Introduction of documents

jquery//jquery must, and needs to be preceded by chosen.js
Chosen.jquery.min.js//compressed version of the chosen core jquery code
Chosen.css//chosen file Two, code example

1. HTML code

<select  class= "Chosen-select" data-placeholder= "Choose a Country ..." multiple> </select>

Data-placeholder is what is displayed by default when you leave the first option blank.
Multiple says you can choose more
Main or class= "Chosen-select"

2. JS Code

$ (". Chosen-select"). Chosen ({
    no_results_text: "No results found.) ",//Search no results when the prompt
    search_contains:true,   ///keyword blur search, set to False, only start from the beginning of the match
    allow_single_deselect:true,// Whether to allow deselect
    max_selected_options:6  ///When Select is multiple selections, max select number
});

3. Event

A) Change event:

$ (". Dept-select"). Chosen (). Change (function () {
    //do something ...
});

b When we need to dynamically update the selection under Select, it is OK to trigger the Liszt:updated event in chosen after updating the selection.

.. $ (". Dept-select"). HTML (' ...<option> department 6</option> ... ');
$ (". Dept-select"). Trigger ("liszt:updated");

The above is only part of the use of chosen Plug-ins, more configuration properties, do please Baidu ...