国家/地区的Select2下拉列表,带有标记

Question

有人有一个易于使用的国家/地区下拉示例,带有国家标志Select2吗？我即将根据这个建议实施一个,但我宁愿避免重新发明轮子.

Answer 1

我正在研究类似的问题,这就是我如何解决它.

(function($) {
    $(function() {
        var isoCountries = [
            { id: 'AF', text: 'Afghanistan'},
            ...
        ];
        //Assuming you have a select element with name country
        // e.g. <select name="name"></select>

        $("[name='country']").select2({
            placeholder: "Select a country",
            data: isoCountries
        });
    });
})(jQuery);

我也有一个关于它的要点,以下是演示.

• 演示1
• 演示2带有基于官方DOC的标志select2

Answer 2

我这样做的方式:

<div class="form-group">
    <label class="control-label">Destination</label>
    <input type="text" name="cdCountry" class="form-control" required />
</div>

<script>
    $("[name='cdCountry']").select2({
        placeholder: "Select a country",
        formatResult: function (country) {
            return $(
              "<span><i class=\"flag flag-" + country.id.toLowerCase() + "\"></i> " + country.text + "</span>"
            );;
        },
        data: yourDataSource
    });
</script>

并使用css库(css和sprite) https://www.flag-sprites.com/

官方DOC

Answer 3

请查看以下链接。

http://www.marghoobuleman.com/countries-dropdown-flags http://vincentlamanna.com/BootstrapFormHelpers/country.html