Asp.net JavaScript的隐藏和显示所有下拉列表项

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

试试这个，我认为这将帮助你.. 演示Here

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

尝试像这样

在代码后面加一个方法类似

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(); 
    }); 
});