时间戳

首页 > 解决方案 > 如何在html的下拉列表中制作带有一个选定项目的下拉列表

html - 如何在html的下拉列表中制作带有一个选定项目的下拉列表

问题描述

当我选择任何一项时，我在下拉列表中有两项，然后只有特定的项目数据来。我想要一个数据默认来。

html

<div class="box-header">
                    <div class="dropdown" align="left">
                        <button class="" type="button" data-toggle="dropdown" style="height:22px;" align="center">
                            <span style="font-size:18px;font-family:sans-serif">Select Water Tank </span>
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" >
                            <li><a href="@Url.Action("list", "Watertank" ,new { deviceid="f2"})"><span style="font-size:large">Top</span></a></li>
                            <li><a href="@Url.Action("list", "Watertank" ,new { deviceid="52"})"><span style="font-size:large">Bottom</span></a></li>
                        </ul>
                    </div>
                </div>

标签： htmlbootstrap-4

解决方案

您可以通过将下拉菜单从更改<ul>为<select>

下面的代码应该默认选择“顶部”

<div class="box-header">
                    <div class="dropdown" align="left">
                        <button class="" type="button" data-toggle="dropdown" style="height:22px;" align="center">
                            <span style="font-size:18px;font-family:sans-serif">Select Water Tank </span>
                            <span class="caret"></span>
                        </button>
                        <select class="bootstrap-select" >
                            <option selected="selected"><a href="@Url.Action("list", "Watertank" ,new { deviceid="f2"})"><span style="font-size:large">Top</span></a></option>
                            <option><a href="@Url.Action("list", "Watertank" ,new { deviceid="52"})"><span style="font-size:large">Bottom</span></a></option>
                        </select>
                    </div>
                </div>

推荐阅读