仅在引导表单助手国家选择器中显示国家子集文本答案

【问题标题】：Only show country subset text in bootstrap formhelpers country picker仅在引导表单助手国家选择器中显示国家子集文本
【发布时间】：2015-03-10 20:02:04
【问题描述】：

我正在使用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”这样的子集名称，但要避免附加“（西班牙）”（国家名称）。所以引导选择只会显示子区域设置国家名称。

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

【问题讨论】：

标签： javascript jquery css twitter-bootstrap form-helpers

【解决方案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的文档

【讨论】：

我想获取区域设置子集以仅显示子区域设置文本（例如在“gl_ES”=>“gl”中，它应该只生成“Galego”作为文本），在您指定的情况下对于其他子语言环境的提及是错误的，因为它仅适用于“es_ES”=>“es”，错误地产生文本“Spain”，而不是“Español”作为巧合。

【解决方案2】：

这是我发现使用 javascript 的唯一棘手的方法，因为我认为引导组件不允许在本机实现中使用此功能。如果将来对某人有更多帮助，请在此处写下解决方案：

<script>
        $( document ).ready(function() 
        {
            $('.bfh-selectbox-options li a').each(function(key, value) {
                //console.log($(this).text().replace(' (Spain)',''))
                $(this).text($(this).text().replace(' (Spain)',''))
            });

            $('.bfh-selectbox-option').text($('.bfh-selectbox-option').text().replace(' (Spain)',''))
        });
</script>

【讨论】：