asp.net < select>下拉列表在限制可见选项时被切断

goqiplq2  于 2022-11-19  发布在  .NET
关注(0)|答案(3)|浏览(130)

我有一个选择下拉菜单,包含一个状态列表。我通过this stackoverflow解决方案限制了点击下拉菜单后的可见选项,如下面的代码所示:

<div>
            <label asp-for="Venture.Location" class="form-label">Venture Location</label>
            <select asp-for="Venture.Location" class="form-input form-select" required onmousedown="this.size=9" onblur="this.size=0" onchange="this.size=0">
                <option disabled selected value="">select an option</option>
                @foreach(var location in Model.Locations)
                {
                    <option value="location">@location</option>
                }
            </select>
        </div>

然而,点击下拉菜单,我会看到一个截止选项,显示超过9个选项。我如何确保通过大小只显示正确的选项数量?我如何摆脱截止选项?

xzlaal3s

xzlaal3s1#

问题是(因为它已经写在你复制代码的答案的一个注解中,这是从IE11崩溃的)。
您可以使用select标签上的size属性简单地修复此问题:

<select id="vehicles" size="2" >
       <option value="Location1">Location1</option>
       <option value="Location2">Location2</option>
       <option value="Location3">Location3</option>
   </select>

这将导致仅显示Location1Location2

qzwqbdag

qzwqbdag2#

答案是select元素上的填充导致了这个问题。一旦mousedown事件发生,我就删除了填充。

whitzsjs

whitzsjs3#

尝试在css中使用

.form-input {
margin: 10px 0px;
padding: 15px;
overflow: auto; /* This option can helpyou!*/
}

相关问题