单击时展开DropDown List

Question

我有一个dropdownlist，每个用户都有一个单独的元素。

元素名称为'Standard'。由于它是单个元素，因此单击下拉列表不会向下展开下拉列表。

是否有任何方法可以扩展点击下拉列表，即使其中包含单个元素。

我知道这个问题没有多大意义，但我的客户对这样的事情感兴趣。

任何工作，任何操纵，任何类型的CSS都可以。

任何指针都将受到高度赞赏。是的，我的申请表在ASP.NET。

代码：

<div style="float: left; vertical-align: middle;">
<asp:DropDownList ID="dropDownListView" Width="100px" runat="server"   CssClass="DropDownStyleSmallWidth">
</asp:DropDownList>
&nbsp;</div>

代码背后：

    public void PopulateOtherViews()
    {
        SaveReportViewFilter<ReportFilterBase> newObj = new SaveReportViewFilter<ReportFilterBase>();
        ViewColumnOptions vwobj = new ViewColumnOptions();
        newObj.UserName = vwobj.Page.User.Identity.Name;
        SaveReportView<ReportFilterBase> obj2 = new SaveReportView<ReportFilterBase>();
        DataTable dt = obj2.GetSaveReportViewFromDataBase(newObj);
        dropDownListView.DataSource = dt;
        dropDownListView.DataTextField = dt.Columns[0].ToString();
        dropDownListView.DataValueField = dt.Columns[0].ToString();
        dropDownListView.DataBind();

    }

基本上我的下拉列表位于一个usercontrol中，该控件填充在Page_Load上。

Answer 1

此代码会将DropDown扩展为ListBox。

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
    $(function () {
      $('#Standard').click(function (){
         $(this).attr("size","1"); 
      });
    });
</script>

希望这会有所帮助。

Answer 2

在这里，我将一个项目列表添加到我的下拉列表中，然后点击它向下扩展为您要求的内容， 如果它的空白，它将向下扩展。

Html标记：

  <asp:DropDownList ID="DropDownList1" runat="server">
      <asp:ListItem>ABC</asp:ListItem>
  </asp:DropDownList>

ScreenShot：

---