Question

我有一个ASP.NET数据绑定下拉列表，它根据文本框的内容填充。在填充之后，我想自动扩展下拉列表，以便用户意识到需要做出选择，而不需要单击下拉列表来展开它。似乎没有财产或方法可以做到这一点。

编辑：在尝试了Ed B的例子之后，我仍然被卡住了。我的ddl的id是'ctl00_ContentPlaceHolder9_ddlContact'。如果我将以下内容放在按钮的onclick事件中，它可以正常工作，下拉可以很好地扩展：

    document.getElementById('ctl00_ContentPlaceHolder9_ddlContact').size=10;

但是，ddl的Databound事件中的以下代码显示警报但不扩展下拉列表：

string script = "<SCRIPT LANGUAGE='JavaScript'> ";
    script += "alert('expanding');document.getElementById('ctl00_ContentPlaceHolder9_ddlContact').size=10 </SCRIPT>";
    ClientScript.RegisterClientScriptBlock(GetType(), "Dropdown", script);

Answer 1

摘要：您无法展开vanilla下拉列表。有关详细信息，请参阅此讨论：Can I open a dropdownlist using jQuery。但是，有些解决方法可以接受。

一种方法（虽然有点厚颜无耻）是让下拉列表展开以同时显示更多项目。默认情况下，元素一次只显示一个列表项，但您可以使用其大小属性让它一次显示多个列表项。使用此方法，您可以在用户将鼠标悬停在DDL上时（模拟扩展它）调整大小属性，然后在鼠标关闭时恢复为大小 1（将其恢复为“正常”DDL）。这是一个例子：

<asp:DropDownList runat="server" ID="ddlColors" 
                  onmouseover="this.size=3;" 
                  onmouseout="this.size=1">
    <asp:ListItem>Red</asp:ListItem>
    <asp:ListItem>Green</asp:ListItem>
    <asp:ListItem>Blue</asp:ListItem>
</asp:DropDownList>

另一种选择是使用JavaScript来创建伪选择。简而言之，您使用脚本和DOM操作以及CSS的组合来获得满足您要求的用户界面。

快乐编程！

Answer 2

您可以在更改后更改下拉列表的大小。选择一个选项后，可以将大小更改回1。

此代码会在鼠标悬停时更改大小，但您在服务器端绑定后将其更改为调用open_ddl。

<script language="javascript">    
function open_ddl()
    {
    document.getElementById("select1").size=5
    }

    function close_ddl()
    {
    document.getElementBById("select1").size=1
    }

    </script>

    Worst President Ever:
    <select id="Select2" runat="SERVER" onmouseover="open_ddl()" onmouseout="close_ddl()">
                     <option value="0" >Obama</option>
                     <option value="1" >Carter</option>
                     <option value="2" >Nixon</option>
                     <option value="3" >Clinton</option>
    </select>

Answer 3

您需要将属性double添加到选择列表中。

这就是你需要附加到DataBound上的脚本变量的javascript代码。（假设您使用的是jQuery）

script+=$("#ctl00_ContentPlaceHolder9_ddlContact").attr("multiple", "multiple");

或者你可以取出javascript并直接在标记中添加多个属性。所以这样做：

DropDownList1.Attributes.Add("multiple","multiple");

强制asp.net下拉列表进行扩展

3 个答案: