Bootstrap 多选按钮宽度问题

Question

我用过Bootstrap的Multiselect。

我的问题是当我从选项中选择项目时。如果名称太长，则按钮宽度也会增加。

选择选项后如何处理按钮宽度。

Answer 1

尝试使用下面的代码。

您可以在 css 中根据需要设置 max-width 。

JavaScript：

 $('#yourXYZID').multiselect({
    buttonText: function(options) 
    {
        var retStr = "";
        if (options.length === 0) {
           retStr = "None selected";
        } else if(options.length <=3){
           var textArray = [];
           $.each(options,function(key,value){
               textArray.push($.trim($(value).html()));
           });
           retStr = "<div class='pull-left restricted'>"+textArray.join(",")+"</div>";
        } else {
           retStr = options.length+" selected";
        }
        return retStr+" <b class='caret'></b>";
    }
 });

CSS：

.multiselect.dropdown-toggle.btn.btn-default > div.restricted {
    margin-right: 5px;
    max-width: 100px;
    overflow: hidden;
}