javascript - 非事件选项卡容器内的选定宽度问题

Question

我正在使用 Chosen 库来轻松过滤下拉控件，我现在面临一个问题。我正在使用 bootstrap 选项卡控件以表格形式排列项目，如果我将 Dropdown 放置在 Choosen 下拉列表的非事件选项卡项目宽度为 0(完全不可见)。

我该如何解决这个问题？

@Html.DropDownListFor(model => model.OriginalItem.AuthorId, (SelectList)ViewBag.LicensorList, "Select", new { @class = "chosen-single chosen-default" })
 $('#OriginalItem_AuthorId').chosen({ no_results_text: "Oops, nothing found!" });

这是我使用所选库的方式

Answer 1

这是因为宽度是在下拉列表可见之前由 Chosen 计算的。

至少有两种解决方法:

CSS 解决方法:

.chosen-container { 
    width: 100% !important; /* desired width */
} 

---

JS 解决方法 (在选择初始化时) :

$(".chosen-select").chosen(
    { 
        width: '100%' /* desired width */
    });