javascript - 仅在 bootstrap formhelpers 国家选择器中显示国家子集文本

Question

我正在使用 Bootstrap FormHelpers country picker我有以下初始化代码:

<div class="bfh-selectbox bfh-languages pull-right" data-language="es_ES" data-available="gl_ES,ca_ES,eu_ES,es_ES" data-flags="false" data-blank="false"></div>

此代码生成此输出:

<div class="bfh-selectbox bfh-languages pull-right" data-language="es_es" data-available="gl_ES,ca_ES,eu_ES,es_ES" data-flags="false" data-blank="false">
<input type="hidden" name="" value="es_es">
<a class="bfh-selectbox-toggle form-control" role="button" data-toggle="bfh-selectbox" href="#">
<span class="bfh-selectbox-option">Galego (Spain)</span>
<span class="caret selectbox-caret"></span></a>

<div class="bfh-selectbox-options">
    <div role="listbox">
        <ul role="option">
            <li>
                <a tabindex="-1" href="#" data-option="gl_ES">Galego (Spain)</a>
            </li>
            <li><a tabindex="-1" href="#" data-option="ca_ES">Català (Spain)</a></li>
            <li><a tabindex="-1" href="#" data-option="eu_ES">Euskara (Spain)</a></li>
            <li><a tabindex="-1" href="#" data-option="es_ES">Español (Spain)</a></li>
        </ul>
    </div>
</div>

这很好，但我只会得到子集名称，如“Galego”、“Catalá”、“Euskara”和“Español”，但避免附加“(西类牙)”(国家名称)。因此，bootstrap select 只会显示子集区域设置国家/地区名称。

这可以很容易地实现吗？我认为唯一可行而且非常难看的是访问 DOM 并在加载页面后在每个 li role="option"中删除 "(Spain)"文本，但我可能正在寻找一些优雅的方式初始化 Bootstrap 选项。

Answer 1

如果你声明它很简单:data-language="es" 而不是 es_ES

<div class="bfh-selectbox bfh-languages pull-right" data-language="es" data-available="gl_ES,ca_ES,eu_ES,es_ES" data-flags="false" data-blank="false"></div>

这是 Language Picker 的文档