記錄一下怎麼取得select 屬性為multiple時，且選擇多個value時，javascript要如何取得所有被選擇的option的value。
<script>
function deleteClick()
{
if(document.form.WdsEnabled[0].checked = true)
document.form.wlanWdsEnabled.value="ON";
else
document.form.wlanWdsEnabled.value="OFF";
var selected = new Array();
必須先宣告一個陣列的變數來存放所有被選擇的option的value。
var mySelect = document.form.elements["WDSList"];
WDSList即是multiple的select的元件
var delWDSentry="";
由於我要根據所選擇的option value動態產生hidden的input欄位在<div id="delMac"></div>中，所以必須宣告一個變數來存放所需新增的input 欄位的html語法。
while(mySelect.selectedIndex != -1) 當select中沒有任何的option時，mySelect.selectedIndex就會是-1，所以此判斷式，是確保select中有option
{
if(mySelect.selectedIndex != 0) 這個if 判斷式必須要mark掉才能夠取得第1個option的值
{
selected.push(mySelect.options[mySelect.selectedIndex].value); selected.push是表示把選擇的這個index的value存放到selected這個陣列中。若選擇的是test2與test4，則selected[0]=2，而selected[1]=4。
}
mySelect.options[mySelect.selectedIndex].selected = false;
}
for(var i = 0; i < selected.length; i++)
{
if (i==0)
delWDSentry = "<input type=\"hidden\" value=\"ON\" name=\"select"+ selected[i]+"\">";
else
delWDSentry += "<input type=\"hidden\" value=\"ON\" name=\"select"+ selected[i]+"\">";
alert(delWDSentry);
}
document.getElementById('delMac').innerHTML=delWDSentry;
if ( !confirm('Do you really want to delete the selected entry?') ) {
return false;
}
else
return true;
}
</script>
</head>
<body>
<form name="form">
<input type="hidden" name="wlanWdsEnabled" value="">
<div id="delMac" name="delMac" "display:none;"></div>
<input type="radio" name="WdsEnabled" value="ON">ON
<input type="radio" name="WdsEnabled" value="OFF">OFF
<select size="8" id="WDSList" name="WDSList" multiple="true" class="input" style="vertical-align:middle; width:150px;">
<option value=1>test1</option>
<option value=2>test2</option>
<option value=3>test3</option>
<option value=4>test4</option>
</select>
<input class="button" type="submit" onClick="return deleteClick();" name="deleteSelWdsMac" value="Delete" size="12">
</form>
</body>
</html>
<script>
function deleteClick()
{
if(document.form.WdsEnabled[0].checked = true)
document.form.wlanWdsEnabled.value="ON";
else
document.form.wlanWdsEnabled.value="OFF";
var selected = new Array();
必須先宣告一個陣列的變數來存放所有被選擇的option的value。
var mySelect = document.form.elements["WDSList"];
WDSList即是multiple的select的元件
var delWDSentry="";
由於我要根據所選擇的option value動態產生hidden的input欄位在<div id="delMac"></div>中，所以必須宣告一個變數來存放所需新增的input 欄位的html語法。
while(mySelect.selectedIndex != -1) 當select中沒有任何的option時，mySelect.selectedIndex就會是-1，所以此判斷式，是確保select中有option
{
if(mySelect.selectedIndex != 0) 這個if 判斷式必須要mark掉才能夠取得第1個option的值
{
selected.push(mySelect.options[mySelect.selectedIndex].value); selected.push是表示把選擇的這個index的value存放到selected這個陣列中。若選擇的是test2與test4，則selected[0]=2，而selected[1]=4。
}
mySelect.options[mySelect.selectedIndex].selected = false;
}
for(var i = 0; i < selected.length; i++)
{
if (i==0)
delWDSentry = "<input type=\"hidden\" value=\"ON\" name=\"select"+ selected[i]+"\">";
else
delWDSentry += "<input type=\"hidden\" value=\"ON\" name=\"select"+ selected[i]+"\">";
alert(delWDSentry);
}
document.getElementById('delMac').innerHTML=delWDSentry;
if ( !confirm('Do you really want to delete the selected entry?') ) {
return false;
}
else
return true;
}
</script>
</head>
<body>
<form name="form">
<input type="hidden" name="wlanWdsEnabled" value="">
<div id="delMac" name="delMac" "display:none;"></div>
<input type="radio" name="WdsEnabled" value="ON">ON
<input type="radio" name="WdsEnabled" value="OFF">OFF
<select size="8" id="WDSList" name="WDSList" multiple="true" class="input" style="vertical-align:middle; width:150px;">
<option value=1>test1</option>
<option value=2>test2</option>
<option value=3>test3</option>
<option value=4>test4</option>
</select>
<input class="button" type="submit" onClick="return deleteClick();" name="deleteSelWdsMac" value="Delete" size="12">
</form>
</body>
</html>
全站熱搜
留言列表
工作筆記本 (8)
