用javascript操縱DropDownList控件，首先得了解select(或DropDownList)的兩個最基本的屬性，一個是value屬性，一個是text屬性，還有一個selectedIndex屬性，用來識別目前選取的項（數字），具體可參見上面的範例程式碼。
以下正式言歸正傳，主要介紹以下幾點：
（1） 清空DropDownList控制項中的值。
document.getElementById('ddlCities').options.length = 0;
(2) 判斷DropDownList中是否有value為'Param1'的ListItem。
function isListItemExist(objDdl , objItemValue)
{
var isExist = false;
for(var i in objSelect.options)
{
if(i.value == objItemValue)
{
isExist = true;
break;
}
}
return isExist;
}JavaScript與DropDownList
伺服器控制項DropDownList與Javascript的之間的傳遞
<script language="javascript">
function hehe()
{
document.all('txtSdept').value =document.all('ddlSdept').options[document.all('ddlSdept').selectedIndex].text;
}
</script>
<asp:DropDownList id="ddlSdept" style="Z-INDEX: 101; LEFT: 240px; POSITION: absolute; TOP: 112px" onchange="hehe()" runat="server">
<asp:ListItem Value="1">计算机系</asp:ListItem>
<asp:ListItem Value="2">机械系</asp:ListItem>
<asp:ListItem Value="3">电子系</asp:ListItem>
<asp:ListItem Value="4">英语系</asp:ListItem>
<asp:ListItem Value="5">中文系</asp:ListItem>
</asp:DropDownList>
<asp:TextBox id="txtSdept" style="Z-INDEX: 102; LEFT: 48px; POSITION: absolute; TOP: 112px" runat="server"></asp:TextBox>1、js腳本如何存取伺服器控制項的值
#介面上有一個TextBox控制項，ID為Name，js裡可以採用以下腳本取Name的值
var myvalue=document.all('Name').value;
2、伺服器控制項如何取js中變數的值
目前未發現比較好的辦法，我通常採用的方法是在介面上放一個隱藏的控制項HtmlInputHidden，然後設定為以伺服器控制項運行，這樣在js腳本中和ASP.NET程式碼裡都可以存取到該控制項的值
js中給伺服器控制項賦值：
var bt＝document.all('Name').value; bt.value='名称';
ASP.NET中使用Name.Value來存取。
3、如何遍歷介面上所有TextBox元素
var inputList = document.body.getElementsByTagName("INPUT");
for(var i=0;i<inputList.length;i++)
{
if(inputList.disabled==false && (inputList.type=='text' || inputList.type=='password'))
{
inputList.value="";
}
}4、讓dropdownlist選擇到指定項目
選擇dropdownlist中值為「我得選擇」得項
var handl=document.all('List1');
var my_value='我得选择';
for(var index=0;index<handle.options.length;index++)
{
if(handle.options[index].text==my_value)
{
handle.selectedIndex=index;
}
}JS取消ListBox,Select,DropDownList選項的選取
javascript中設定dropdownlist哪一項為目前選取項目
方法1:
i = 2 document.all.dropdownlistID.options[i].selected=true
方法2:
obj.selectedIndex = 2;
方法3:
obj.value="你要设的数值。"//Dropdownlist就会自动把那个值设为当前。 javascript清除dropdownlist的项
//清除原有项
function clearitem(){
var drp1 = document.getElementById("drp1");
while(drp1.options.length>0)
{
drp1.options.remove(0);
}
}動態變更方法（根據城市程式碼取得該市商業區並新增至DropDownList中）
function getsyq()
{
var city = document.getElementById("DropDownList_Cities").value; //取得城市代码
var htp = new ActiveXObject("Msxml2.XMLHTTP");
var drp1 = document.getElementById("drp1");
var url = "?stat=1&city="+city
htp.open("post",url,true)
htp.onreadystatechange=function()
{
if(htp.readyState==4)
{
clearitem(); //清除原有下拉项
var str = htp.responseText;
var opt = str.split(',');
var s = opt.length
for(var j = 0;j<s;j++)
{
var newOption = document.createElement("OPTION"); //定义一个新的项
var ff = opt[j].split('|');
newOption.text = ff[1];
newOption.value = ff[1];
drp1.options.add(newOption);
}
}
}
htp.send()
}以上是javascript操縱DropDownList控制項具體用法實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！
