cshtml 在 DropdownList 中隐藏溢出，但在鼠标悬停时显示答案

【问题标题】：cshtml hide overflow in the DropdownList but show when the mouse is hovered overcshtml 在 DropdownList 中隐藏溢出，但在鼠标悬停时显示
【发布时间】：2013-02-28 10:35:29
【问题描述】：

我的 cshtml 视图中有一个下拉列表。但是有些字符串太长而不能在一行中显示。如下图：

我需要设置它，以便在下拉列表中只显示一定数量的字符，并且当鼠标悬停在整个字符串上时应该是场景，类似于工具提示文本。

<div class="span11">
        @Html.DropDownList("specificationList", new SelectList(ViewBag.Specifications, "SpecificationId", "Name", ViewBag.SpecificationId), new { @class = "dropdown-toggle" })
    </div>

【问题讨论】：

标签： razor drop-down-menu

【解决方案1】：

这里的困难在于 DropDownListFor 助手不允许在 <option> 标签上设置自定义属性。为了使您的工具提示起作用，您需要生成以下标记：

<select name="specificationId">
    <option value="1" title="some very long description">item 1</option>
    <option value="2" title="some very long description 2">item 2</option>
    <option value="3" title="some very long description 3">item 3</option>
    ...
</select>

为了实现这一点，您可以在视图中编写意大利面条式代码以手动循环遍历模型的值（完全不推荐），或者编写一个自定义 HTML 帮助程序来允许您输出此标记。我在this post 上展示了一个这样的助手示例。还有here。您当然可以调整帮助程序，以便如果项目的文本长于一定数量的字符，它将生成截断它。

【讨论】：

【解决方案2】：

使用 css 文本溢出：省略号

【讨论】：