Php 下拉菜单中带有值的图标标志

我有引导下拉菜单和选项选择。我想在左侧文本附近添加国旗。我做到了，但问题是当我在下拉列表中选择选项并提交它时，标志也通过php/html发送。我不知道如何将其放置在此处，以避免提交带有

的标志，并将标志放在左侧

HTML:

所有联赛

巴西
巴西
巴西
巴西
巴西
巴西
巴西
巴西
巴西

选择带有字体和字体标志图标的下拉列表

FontAwesome演示

$（document.body）.on（'单击'，'.下拉菜单li'，函数（事件）{
var$target=$（event.currentTarget）；
$target.closest（“.btn组”）
.find（'[data bind=“label”]'）.text（$target.text（））
(完)
.children（'.dropdown toggle'）。dropdown（'toggle'）；
返回false；
});
.btn输入{
显示：块；
}
.btn输入.btn.form-control{
文本对齐：左对齐；
}
.btn input.btn.form-control范围：第一个子项{
左：10px；
溢出：隐藏；
位置：绝对位置；
右：25px；
}
.btn input.btn.form-control.caret{
页边顶部：-1px；
位置：绝对位置；
右：10px；
最高：50%；
}

选择带有图标的下拉列表
所有联赛





选择带有字体和字体标志图标的下拉列表

FontAwesome演示


$（document.body）.on（'单击'，'.下拉菜单li'，函数（事件）{
var$target=$（event.currentTarget）；
$target.closest（“.btn组”）
.find（'[data bind=“label”]'）.text（$target.text（））
(完)
.children（'.dropdown toggle'）。dropdown（'toggle'）；
返回false；
});
.btn输入{
显示：块；
}
.btn输入.btn.form-control{
文本对齐：左对齐；
}
.btn input.btn.form-control范围：第一个子项{
左：10px；
溢出：隐藏；
位置：绝对位置；
右：25px；
}
.btn input.btn.form-control.caret{
页边顶部：-1px；
位置：绝对位置；
右：10px；
最高：50%；
}

选择带有图标的下拉列表
所有联赛





它正在处理您的html下拉列表，但我无法植入我使用的：[link]（）我已经看到了您给定的链接。这是一个带有一堆引导选择框的演示。是否要将此图标添加到该选择框中？是。这是我寄给你的。自定义图标，如“我的代码”中的图标，而不是bootstrapI中的图标，已经用给定的选择框创建了新的小提琴，我还集成了图标。请查看演示@用户3307783，如果你打算使用我的示例作为参考，不妨接受它作为答案。它正在处理你的html下拉列表，但我无法插入我使用的：[link]（）我已经看到了你给定的链接。这是一个带有一堆引导选择框的演示。是否要将此图标添加到该选择框中？是。这是我寄给你的。自定义图标，如“我的代码”中的图标，而不是bootstrapI中的图标，已经用给定的选择框创建了新的小提琴，我还集成了图标。请查看演示@用户3307783，如果您打算使用我的示例作为参考，那么最好接受它作为答案。
<a class="btn btn-primary btn-select">
  <span class="btn-select-arrow glyphicon glyphicon-chevron-down"></span>
  <input class="btn-select-input" id="select_league" name="league" type="hidden">
  <span class="btn-select-value">All leagues</span>
  <ul style="display: none;">
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
    <li class=""><span class="flag-icon flag-icon-br"></span>Brazil</li>
  </ul>            
</a>