javascript(JS)完全控制Select下拉框
文章来源：365jz.com 点击数：1546 更新时间：2009-09-24 22:30 参与评论
1
<select id="mysel" name="mysel">
2 <option value="1">1 xxxxxxxxxx</option>
3 <option value="2">2 yyyyyyyyyy</option>
4 <option value="3">3 zzzzzzzzzz</option>
5 <option value="4">4 wwwwwwwwww</option>
6</select>
7<button onclick="setSel(3)">设置第３项为选中项</button>
8<button onclick="clearSel()">清空选择框</button>
9<button onclick="fillSel()">填充选择框</button>
10<button onclick="removeSel()">移除第一项</button>
11<button onclick="editSel()">修改第一项</button>
12
13
<script type="text/javascript">
14
function setSel(str){
15 with(document.all){
16 for(var i=0;i<mysel.options.length;i++){
17 if (mysel.options[i].value==str){
18
mysel.selectedIndex=i;
19 break;
20
}
21 }
22 }
23 }
24
25
26 function clearSel(){
27 with(document.all){
28 mysel.options.length=0;
29 }
30 }
31
32 function fillSel(){
33 with(document.all){
34 mysel.options.length=0;
35 mysel.options[0] = new Option("1 xxxxxxxxxx","1");
36 mysel.options[1] = new Option("2 yyyyyyyyyy","2");
37 mysel.options[2] = new Option("3 zzzzzzzzzz","3");
38 mysel.options[3] = new Option("4 wwwwwwwwww","4");
39 mysel.options[4] = new Option("5 aaaaaaaaaa","5");
40
41 mysel.selectedIndex = 4;
42 }
43 }
44
45 function removeSel(){
46 with(document.all){
47 mysel.remove(0);
48 if (mysel.options.length>0){
49 mysel.selectedIndex=0;
50 }
51 }
52 }
53
54 function editSel(){
55 with(document.all){
56 if (mysel.options.length>0){
57 mysel.options[0] = new Option("这是新的第一项","new Value")
58 mysel.selectedIndex=0;
59 }
60 }
61
}
62</script>
<select id="mysel" name="mysel">2
<option value="1">1 xxxxxxxxxx</option>3
<option value="2">2 yyyyyyyyyy</option>4
<option value="3">3 zzzzzzzzzz</option>5
<option value="4">4 wwwwwwwwww</option>6
</select>7
<button onclick="setSel(3)">设置第３项为选中项</button>8
<button onclick="clearSel()">清空选择框</button>9
<button onclick="fillSel()">填充选择框</button>10
<button onclick="removeSel()">移除第一项</button>11
<button onclick="editSel()">修改第一项</button>12
13
<script type="text/javascript">
14
function setSel(str){
15
with(document.all){ 16
for(var i=0;i<mysel.options.length;i++){ 17
if (mysel.options[i].value==str){18
mysel.selectedIndex=i;19
break;20
}21
} 22
}23
}24
25
26
function clearSel(){27
with(document.all){ 28
mysel.options.length=0;29
}30
}31
32
function fillSel(){33
with(document.all){34
mysel.options.length=0;35
mysel.options[0] = new Option("1 xxxxxxxxxx","1");36
mysel.options[1] = new Option("2 yyyyyyyyyy","2");37
mysel.options[2] = new Option("3 zzzzzzzzzz","3");38
mysel.options[3] = new Option("4 wwwwwwwwww","4");39
mysel.options[4] = new Option("5 aaaaaaaaaa","5");40
41
mysel.selectedIndex = 4;42
}43
}44
45
function removeSel(){46
with(document.all){47
mysel.remove(0);48
if (mysel.options.length>0){49
mysel.selectedIndex=0;50
}51
}52
}53
54
function editSel(){55
with(document.all){56
if (mysel.options.length>0){57
mysel.options[0] = new Option("这是新的第一项","new Value")58
mysel.selectedIndex=0;59
}60
}61
}62
</script>
如对本文有疑问，请提交到交流论坛，广大热心网友会为你解答！！ 点击进入论坛
您可能感兴趣的文章:
------分隔线----------------------------
