Question

您好我的asp.net中有一个下拉列表，我想隐藏并在我的下拉列表中显示我的所有项目

<asp:DropDownList id="DropDownList1" runat="server">
 <asp:listitem value="">Select one</asp:listitem>
 <asp:listitem value="1">Item 1</asp:listitem>
 <asp:listitem value="2">Item 2</asp:listitem>
 <asp:listitem value="3">Item 3</asp:listitem>
 <asp:listitem value="4">Item 4</asp:listitem>
 <asp:listitem value="5">Item 5</asp:listitem>
 <asp:listitem value="6">Item 6</asp:listitem>
 <asp:listitem value="7">Item 7</asp:listitem>
 <asp:listitem value="8">Item 8</asp:listitem>
 <asp:listitem value="9">Item 9</asp:listitem>
 <asp:listitem value="10">Item 10</asp:listitem>
</asp:DropDownList>

我有一个按钮btnHideAll和btnShowALL 如果btnHideAll我想隐藏所有这个项目，当btnshowall只显示所有这些..

Answer 1

试试这个

<script>
     function toggleSelect(show){
        var sel = document.getElementById('<%=DropDownList1.ClientID%>');
        var selHTML = sel.innerHTML;

        if( selHTML != '' && !show) {
            // save items HTML on first call
            if( window['selHTML']== undefined ||  !window['selHTML'] ) window['selHTML'] = selHTML;
            sel.innerHTML ='';
        }else if( selHTML == '' && show ){
            sel.innerHTML = window['selHTML']
        }   
    };
 </script>

假设你有一个带有javascript函数的按钮，名为onclick

<input type="button" value="btnHideAll" onclick="toggleSelect(false)" />
<input type="button" value="btnShowALL" onclick="toggleSelect(true)" />

Answer 2

尝试这样

在代码后面添加一个方法，如

public List<Object> dfgdf()
{
 List<object> lst=new List<object>;

 lst.add(item1);   // add data

 return lst;
}

在剧本中：

   $(document).ready(function(){
      $("#btnShowALL").click(function(){
      $.getJSON("/Codebehind.aspx.cs/dfgdf",function(result){
      $.each(result, function(i, field){
      $("#DropDownList1").append(field + " ");
         });
      });
    });
 $("#btnHideAll").click(function(){
      $("#DropDownList1").empty(); 
    });
});

Answer 3

<input type="button" value="Hide options" onclick="changeVisible(false)" />
<input type="button" value="Show options" onclick="changeVisible(true)" />

function changeVisible(visible){
    var dropDown = document.getElementById("<%= DropDownList1.ClientID %>");
    var options = dropDown.getElementsByTagName("option");
    for(var i = 0; i < options.length; ++i){
        options[i].style.display = visible? "inline" : "none";
    }
}

Answer 4

试试这个，我想这会对你有所帮助.. 演示Here

Asp.net javascript隐藏并显示所有下拉列表项

4 个答案: