基于javascript左右移动列表框

本文解释了javascript左右移动listbox的详细代码，并分享给大家参考。具体内容如下。

渲染：

特定代码：

超文本标记语言头元http-equiv='内容-类型' Content=' text/html；charset=gb2312'/titlelistbox左右移动/title/head body div style='底色： # CCC宽度宽度：450像素高度：300 pxmargin:150px，0，0，450 px；边框：1 px solid ' table align=' center ' width=' 285 ' height=' 169 ' bgcolor=' # 99CCFF ' tr TD width=' 100 ' select name=' first ' id=' first ' size=' 10 ' multiple=' multiple ' style='底色： # 3FC'选项值='选项1'选项1/选项选项值='选项2'选项2/选项选项值='选项3'选项3/选项选项值='选项4'选项4/选项选项值='选项5'选项5/选项选项值='选项6'选项6/选项选项值='选项7'选项7/选项选项值='选项8'选项8/选项/选择/TD TD TD宽度=' 85 ' valign='中间'输入名称='add' id='add' type='button '值=' - '/输入名称=' add _ all ' id=' add _ all ' type=' button '值='==='/输入名称=' remove ' id=' remove ' type=' button '值=' - '/输入名称=' remove _ all ' id=' remove _ all ' type=' button '值='=='//TD宽度=' 100 '选项值='选项9'选项9/选项/选择/TD/tr/表格/div/正文脚本类型='text/javascript' //左移右/*输入名称=' add ' id=' add ' type=' button ' value='-'/*/document。 getelementbyid(' add ').onclick=函数add(){ var first sel=document。getelementbyid(' first ')；var选项=首次选择。getelementsbytagname(' option ')；//javascript的数组是动态数组，长度是可以变的。 //所以先取得下拉列表的长度，避免选择权被移走后长度变小，导致后面循环终止，出现beg var op length=option . length var second sel=document。getelementbyid(' second ')；for(I=0；IOPs长度；i ) { /* selectedIndex:该下标返回下拉列表的索引值注：如果有多个被选中的情况下，永远返回第一个选中的索引值，索引最小的那个如果没有被选中的情况下，返回-1选择索引是挑选的属性*/if(firstSel.selectedIndex！=-1) { secondSel.appendChild(选项[第一次出售。selectedindex])；} } }/*输入名称=' add _ all ' id=' add _ all ' type=' button ' value='=='/*/document。getelementbyid(' add _ all ').onclick=函数addAll(){ var first sel=document。getelementbyid(' first ')；var选项=首次选择。getelementsbytagname(' option ')；//javascript的数组是动态数组，长度是可以变的。 //所以先取得下拉列表的长度，避免选择权被移走后长度变小，导致后面循环终止，出现beg var op length=option . length var second sel=document。getelementbyid(' second ')；for(I=0；IOPs长度；i ) { /*因为爪哇岛描述语言的数组是动态数组，长度是可以变的。所以当移走全部把数组的值移走（一个一个的移走，数组长度马上-1,所以数组下标也是-1.因次我们要把每次移的是走下标为0的那个数，这样才保证可以全部移走)*/secondSel.appendChild(选项[0]);} } /*双击后把选择权移到右边*/文档。getelementbyid(' first ').ondblclick=函数dblclick() { /*方法一*//* var first sel=文档。getelementbyid(' first ')；var选项=首次选择。getelementsbytagname(' option ')；//javascript的数组是动态数组，长度是可以变的。

//所以先取得下拉列表的长度，避免选择权被移走后长度变小，导致后面循环终止，出现beg var op length=option . length var second sel=document。getelementbyid(' second ')；for(I=0；IOPs长度；i ) { //双击可以看成：第一次点击选中，第二次点击移动secondSel.appendChild(选项[第一次出售。selectedindex])；} *//*方法二*//*这：这表示document.getElementById('first ')下拉列表this.selectedIndex表示下拉列表选中的项*/var secondSel=document。getelementbyid(' second ')；秒塞尔。appendchild(这个[这个。selectedindex])；} //右移左/*输入名称=' remove ' id=' remove ' type=' button ' value='-'/*/document。getelementbyid(' remove ').onclick=函数remove(){ var secondSel=document。getelementbyid(' second ')；var first sel=文档。getelementbyid(' first ')；var选项=secondsel。getelementsbytagname(' option ')；//javascript的数组是动态数组，长度是可以变的。 //所以先取得下拉列表的长度，避免选择权被移走后长度变小，导致后面循环终止，出现beg var op length=option . length for(I=0；IOPs长度；i ) { /* selectedIndex:该下标返回下拉列表的索引值注：如果有多个被选中的情况下，永远返回第一个选中的索引值，索引最小的那个如果没有被选中的情况下，返回-1选择索引是挑选的属性*/if(secondSel.selectedIndex！=-1) { firstSel.appendChild(选项[秒选。selectedindex])；} } }/*输入名称=' remove _ all ' id=' remove _ all ' type=' button ' value='=='/*/document。getelementbyid(' remove _ all ').onclick=函数remove _ all(){ var secondSel=document。getelementbyid(' second ')；var first sel=文档。getelementbyid(' first ')；var选项=secondsel。getelementsbytagname(' option ')；//javascript的数组是动态数组，长度是可以变的。 //所以先取得下拉列表的长度，避免选择权被移走后长度变小，导致后面循环终止，出现beg var op length=option . length for(I=0；IOPs长度；i ) { /*因为爪哇岛描述语言的数组是动态数组，长度是可以变的。所以当移走全部把数组的值移走（一个一个的移走，数组长度马上-1,所以数组下标也是-1.因次我们要把每次移的是走下标为0的那个数，这样才保证可以全部移走)*/firstSel.appendChild(选项[0]);} } /*双击后把选择权移到右边*/文档。getelementbyid('秒').ondblclick=函数dblclick() { /*方法一*//* var secondSel=document。getelementbyid(' second ')；var first sel=文档。getelementbyid(' first ')；var选项=secondsel。getelementsbytagname(' option ')；//javascript的数组是动态数组，长度是可以变的。 //所以先取得下拉列表的长度，避免选择权被移走后长度变小，导致后面循环终止，出现beg var op length=option . length for(I=0；IOPs长度；i ) { //双击可以看成：第一次点击选中，第二次点击移动firstSel.appendChild(选项[秒选。selectedindex])；} *//*方法二*//*这：这表示document.getElementById('秒)下拉列表this.selectedIndex表示下拉列表选中的项*/var first sel=文档。getelementbyid(' first ')；第一次出售。appendchild(这个[这个。selectedindex])；}/脚本/html代码注释很详细，希望可以帮到大家。

以上就是本文的全部内容，希望对大家学习javascript编程有所帮助。