javascript - 如何在 Bootstrap 多选中添加标签？

Question

这里是否有任何选项可以默认显示图像。

代码:

<select id="example-post" style="width:120px;!important;" class="footerSelect" name="multiselect[]" multiple="multiple">
    <option value="1">test</option>
    <option value="2">test1</option>
    <option value="3">test2 </option>             

</select>

 $('.multiselect-selected-text').text('Options');

这里我不想显示选项而是默认显示图像。

示例图片:

Answer 1

您只需在按钮中添加字形图标。

<span class="glyphicon glyphicon-pencil"></span>

完整示例:

<div class="dropdown">
  <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown" aria-expanded="true">
      <span class="glyphicon glyphicon-pencil"></span>
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
  </ul>
</div>

JSFiddle

此外，您可以使用 jQuery 动态添加此类元素。

var span = $('<span></span>');
span.addClass('glyphicon');
span.addClass('glyphicon-pencil');
$('#foo').html(span);