Question

您好我有下拉列表代码我想在那里添加占位符我可以添加吗？

<asp:DropDownList id="ddlyear" runat="server" >
                     <asp:ListItem >Experience</asp:ListItem>
                     <asp:ListItem>Fresher</asp:ListItem>
                     <asp:ListItem>1</asp:ListItem>
                     <asp:ListItem>2</asp:ListItem>
                     <asp:ListItem>3</asp:ListItem>
</asp:DropDownList>

我想这样表现出来

Answer 1

你无法单独使用HTML，你需要Html + jQuery才能实现这一点。

<asp:DropDownList ID="ddlyear" runat="server">
    <asp:ListItem>Experience</asp:ListItem>
    <asp:ListItem>Fresher</asp:ListItem>
    <asp:ListItem>1</asp:ListItem>
    <asp:ListItem>2</asp:ListItem>
    <asp:ListItem>3</asp:ListItem>
</asp:DropDownList>

在此之后，你需要你的jQuery通过删除并重新附加占位符来实现魔力。

<script>
var isChanged = false;
$(function () {
    $('#ddlyear').focusin(function () {
        if (!isChanged) {
// this removes the first item which is your placeholder if it is never changed
            $(this).find('option:first').remove();
        }
    });
    $('#ddlyear').change(function () {
// this marks the selection to have changed
        isChanged = true;
    });
    $('#ddlyear').focusout(function () {
        if (!isChanged) {
// if the control loses focus and there is no change in selection, return the first item
            $(this).prepend('<option selected="selected" value="0">Experience</option>');
        }
    });
});
</script>

请注意，您需要jQuery才能使用它，只需将其安装为nuget包或手动下载并在您的aspx中添加声明。

<head runat="server">
    <title></title>
// Sample only, you can place it in any location or use any version
    <script src="../scripts/jquery-2.2.2.min.js"></script>
</head>

Answer 2

@amit

兄弟试试这个......

<select placeholder="select your beverage">
<option value="" default="" selected="">select your beverage</option>
<option value="tea">Tea</option>
<option value="coffee">Coffee</option>
<option value="soda">Soda</option>
</select>

Answer 3

在许多情况下，将空项目或虚拟项目作为第一项是可以接受的。 'empty'表示该值为空，文本可以是您想要的任何内容。

所以这样：

<asp:DropDownList id="ddlyear" runat="server">
    <asp:ListItem Value="">Select</asp:ListItem>
    <asp:ListItem Value="Experience">Experience</asp:ListItem>
    <asp:ListItem Value="Fresher">Fresher</asp:ListItem>
    <asp:ListItem Value="1">1</asp:ListItem>
    <asp:ListItem Value="2">2</asp:ListItem>
    <asp:ListItem Value="3">3</asp:ListItem>
</asp:DropDownList>

Answer 4

你可以这样做：

    <asp:DropDownList id="ddlyear" runat="server" >
                     <asp:ListItem selected hidden>Experience</asp:ListItem>
                     <asp:ListItem>Fresher</asp:ListItem>
                     <asp:ListItem>1</asp:ListItem>
                     <asp:ListItem>2</asp:ListItem>
                     <asp:ListItem>3</asp:ListItem>
    </asp:DropDownList>

selected将其设为默认值，而hidden则阻止其在展开列表中显示。

这是最简单的方法。

如何在下拉列表中添加占位符c＃

4 个答案: