<select id="mysel" name="mysel">
<option value="1">1 xxxxxxxxxx</option>
<option value="2">2 yyyyyyyyyy</option>
<option value="3">3 zzzzzzzzzz</option>
<option value="4">4 wwwwwwwwww</option>
</select>
<button onclick="setSel(3)">設定第3項為選中項</button>
<button onclick="clearSel()">清空選擇框</button>
<button onclick="fillSel()">填充選擇框</button>
<button onclick="removeSel()">移除第一項</button>
<button onclick="editSel()">修改第一項</button>
<button onclick="sortMe(mysel)">排序</button>
<script type="text/javascript">
function setSel(str){
with(document.all){
for(var i=0;i<mysel.options.length;i++){
if (mysel.options[i].value==str){
mysel.selectedIndex=i;
break;
}
}
}
}
function clearSel(){
with(document.all){
mysel.options.length=0;
}
}
function fillSel(){
with(document.all){
mysel.options.length=0;
mysel.options[0] = new Option("1 xxxxxxxxxx","1");
mysel.options[1] = new Option("2 yyyyyyyyyy","2");
mysel.options[2] = new Option("3 zzzzzzzzzz","3");
mysel.options[3] = new Option("4 wwwwwwwwww","4");
mysel.options[4] = new Option("5 aaaaaaaaaa","5");
mysel.selectedIndex = 4;
}
}
function removeSel(){
with(document.all){
mysel.remove(0);
if (mysel.options.length>0){
mysel.selectedIndex=0;
}
}
}
function editSel(){
with(document.all){
if (mysel.options.length>0){
mysel.options[0] = new Option("這是新的第一項","new Value")
mysel.selectedIndex=0;
}
}
}
function sortMe(oSel){
var ln = oSel.options.length;
var arr = new Array(); // 這是關鍵區段
// 將select中的所有option的value值將儲存在Array中
for (var i = 0; i < ln; i++)
{
// 如果需要對option中的文本排序,可以改為arr[i] = oSel.options[i].text;
arr[i] = oSel.options[i].value;
}
arr.sort(); // 開始排序
// 清空Select中全部Option
while (ln--)
{
oSel.options[ln] = null;
}
// 將排序後的數組重新添加到Select中
for (i = 0; i < arr.length; i++)
{
oSel.add(new Option(arr[i], arr[i]));
}
}
</script>