jquery - 如何限制下拉列表的宽度

Question

我有一个包含一些下拉列表的 html 表格。

<table>
    <thead>
        <tr>
            <th>@Html.LabelFor(model => model.WorkorderId)</th>
            <th>@Html.LabelFor(model => model.SubmissionDate)</th>
            <th>@Html.LabelFor(model => model.PartId)</th>
            <th>@Html.LabelFor(model => model.ActivityId)</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>@Html.DropDownList("WorkorderId", (SelectList) ViewBag.Workorders, string.Empty)</td>
            <td>@Html.TextBoxFor(model => model.SubmissionDate, "{0:MM/dd/yyyy}", new { @class = "datefield" })</td>
            <td>@Html.DropDownList("PartId", (SelectList) ViewBag.Parts, string.Empty)</td>
            <td>@Html.DropDownList("ActivityId", (SelectList) ViewBag.Activities, string.Empty)</td>
        </tr>
    </tbody>
</table>

其中一列(The PartId column)，有很长的描述。它几乎占据了整个页面。

12345 - The very long description for Part

我想将下拉列表的宽度限制为与 PartNumber 一样长(没有描述)。现在，下拉列表的宽度等于 PartNumer - Description 中最长的一个。

有没有一种方法可以在选择零件编号 (12345) 时只显示零件编号 (12345)，但在单击下拉菜单时显示整个零件(编号 - 描述)？

Answer 1

将下拉列表的宽度限制为 150px :

 @Html.DropDownList("WorkorderId", (SelectList) ViewBag.Workorders, new { @style = "max-width:150px;" }